TypeScript - 選擇結構：初學者指南

你好啊，未來的編程超級巨星！? 今天，我們將要深入編程中最基礎的概念之一：TypeScript中的if...else語句。把它看作是你的代碼中的決策者，就像一隻智慧的貓頭鵝，幫助你的程序選擇哪條路徑走。讓我們一起踏上這個令人興奮的旅程！

TypeScript - If Else Statement

如果...不然語句是什麼？

在我們深入細節之前，先來了解if...else語句是什麼。想像你在一個冰淇淋店，你需要決定選擇巧克力還是香草。你的思考過程可能會這樣：

"如果巧克力有貨，我就選巧克力。否則（不然），我就選香草。"

這正是編程中的if...else語句的工作原理！它允許你的代碼基於某些條件來做決定。

語法

現在，我們來看看如何在TypeScript中寫一個if...else語句。別擔心，如果起先看起來有點奇怪——我們會一步一步分解！

if (condition) {
// 條件為真時要執行的代碼
} else {
// 條件為假時要執行的代碼
}

讓我們分解一下：

if：這個關鍵字開始語句。
(condition)：這裡是你的條件。就像問一個問題。
{ }：這些花括號包含條件為真時要執行的代碼。
else：這個關鍵字引入了另一個選項。
{ }：這些花括號包含條件為假時要執行的代碼。

流程圖

為了直觀地了解if...else語句的工作原理，我們來看一個簡單的流程圖：

[開始]
|
v
[檢查條件]
/           \
(是)        (否)
|             |
v             v
[執行真]  [執行假]
|             |
v             v
[繼續]

這個流程圖展示了你的程序如何根據條件為真或假來決定走哪條路徑。

示例

現在，讓我們來看看一些現實世界的例子，以了解if...else語句是如何實際運作的！

示例 1：冰淇淋決定

讓我們來編寫我們之前提到的冰淇淋決定：

let chocolateAvailable: boolean = true;

if (chocolateAvailable) {
console.log("太棒了！我要選擇巧克力冰淇淋。");
} else {
console.log("我想我會選擇香草冰淇淋。");
}

在這個例子中：

我們聲明了一個變量chocolateAvailable並設為true。
if語句檢查chocolateAvailable是否為真。
因為它是真的，所以第一組花括號內的代碼將會運行。
控制台會顯示："太棒了！我要選擇巧克力冰淇淋。"

試試將chocolateAvailable改為false，看看會發生什麼！

示例 2：基於時間的問候

讓我們創一個程序，根據一天中的時間來給你不同的問候：

let currentHour: number = 14; // 下午2點

if (currentHour < 12) {
console.log("早安！");
} else if (currentHour < 18) {
console.log("午安！");
} else {
console.log("晚安！");
}

這裡發生了什麼：

我們設置currentHour為14（下午2點）。
第一個條件currentHour < 12是假的，所以我們移到下一個條件。
currentHour < 18是真的，所以"午安！"會被輸出到控制台。
最後的else語句被跳過。

示例 3：成績計算器

讓我們創一個簡單的成績計算器：

let score: number = 85;
let grade: string;

if (score >= 90) {
grade = "A";
} else if (score >= 80) {
grade = "B";
} else if (score >= 70) {
grade = "C";
} else if (score >= 60) {
grade = "D";
} else {
grade = "F";
}

console.log(`你的成績是：${grade}`);

在這個例子中：

我們設置了一個score為85。
我們使用多個if...else if語句來檢查成績對應不同的範圍。
因為85大於或等於80，所以成績被設為"B"。
最後，我們將成績輸出到控制台。

常見方法和使用

這裡有一個常用方法和運算符的表格，你可能會在if...else語句中使用：

方法/運算符	描述	示例
`===`	嚴格相等	`if (x === 5)`
`!==`	嚴格不等	`if (y !== 10)`
`>`	大於	`if (age > 18)`
`<`	小於	`if (temperature < 0)`
`>=`	大於或等於	`if (score >= 60)`
`<=`	小於或等於	`if (quantity <= 0)`
`&&`	邏輯與	`if (x > 0 && x < 10)`
`\|\|`	邏輯或	`if (day === "Sat" \|\| day === "Sun")`
`!`	邏輯非	`if (!isLoggedIn)`

結論

恭喜你！你剛剛踏出了進入TypeScript條件編程世界的第一步。記住，這些語句就像你代碼中的交通燈，根據你設置的條件引導你的程序走上不同的路徑。

隨著你編程旅程的繼續，你會發現自己經常使用if...else語句。它們非常通用和強大。所以，繼續練習，很快你就能像選擇巧克力還是香草冰淇淋一樣輕鬆地在代碼中做決策！

快樂編程，並記住——在編程中，就像在生活中一樣，一切都關乎於做出正確的選擇！??

Credits: Image by storyset