JavaScript - 如果...否则：初学者指南

你好，有抱负的程序员们！今天，我们将深入编程中最基本的概念之一：if...else 语句。把它想象成你代码中的决策者，就像交通信号灯在路口引导车辆一样。让我们开始吧！

if-else 的流程图

在我们跳进代码之前，让我们先可视化一下 if...else 语句是如何工作的。想象你站在一个岔路口：

[條件]
/    \
/      \
/        \
[True]      [False]
|            |
[動作 1]   [動作 2]

这个简单的图表展示了 if...else 的本质：如果条件为真，做一件事；否则，做另一件事。

JavaScript if 語句

让我们从基本的 'if' 语句开始。这就像说，“如果下雨，带上雨伞。”

let isRaining = true;

if (isRaining) {
console.log("不要忘記你的雨伞！");
}

在这个例子中，如果 isRaining 为真，消息将被打印。如果它是假的，什么也不会发生。简单吧？

让我们再试一个例子：

let temperature = 25;

if (temperature > 30) {
console.log("外面很热！");
}

在这里，只有当温度高于30度时，消息才会出现。在这种情况下，它不会打印任何东西，因为25不大于30。

JavaScript if...else 語句

现在，如果我们想在条件为假时做些什么呢？这时 'else' 就派上用场了。这就像说，“如果下雨，带上雨伞；否则，戴上太阳镜。”

let isRaining = false;

if (isRaining) {
console.log("不要忘記你的雨伞！");
} else {
console.log("享受阳光明媚的一天！");
}

在这种情况下，由于 isRaining 是假的，第二个消息将被打印。

这里再有一个例子：

let age = 15;

if (age >= 18) {
console.log("你可以投票！");
} else {
console.log("對不起，你太小了，不能投票。");
}

由于15小于18，所以“對不起，你太小了，不能投票”的消息将被显示。

JavaScript if...else if... 語句

有时候，生活并不只是非黑即白。我们需要更多的选择！这时 'else if' 就很方便了。这就像一个多项选择题。

let grade = 75;

if (grade >= 90) {
console.log("A - 優秀！");
} else if (grade >= 80) {
console.log("B - 做得好！");
} else if (grade >= 70) {
console.log("C - 不錯！");
} else if (grade >= 60) {
console.log("D - 你需要多學習。");
} else {
console.log("F - 哎呀！你失败了。");
}

在这个例子中，成绩是75，所以输出将是 "C - 不錯！"。代码按顺序检查每个条件，并在找到第一个为真的条件时停止。

让我们再试一个：

let time = 14;

if (time < 12) {
console.log("早上好！");
} else if (time < 18) {
console.log("下午好！");
} else {
console.log("晚上好！");
}

由于时间是14（下午2点），输出将是 "下午好！"。

嵌套的 if...else 語句

有时候，你可能需要在条件内部检查其他条件。这时嵌套的 if...else 语句就派上用场了。

let isWeekend = true;
let isRaining = false;

if (isWeekend) {
if (isRaining) {
console.log("這是一個下雨的週末。讀書的完美時機！");
} else {
console.log("這是一個晴朗的週末。我們去野餐吧！");
}
} else {
console.log("這是一個工作日。該工作了！");
}

在这个例子中，我们首先检查是否是周末。如果是，我们再检查是否下雨来决定建议的活动。

如果...否则方法的比较表

这里有一个方便的表格，总结了我们已经讨论过的不同的 if...else 方法：

方法	语法	用例
if	if (condition) { ... }	当你只想在条件为真时执行代码
if...else	if (condition) { ... } else { ... }	当你想要在条件为真时有一个结果，在条件为假时有另一个结果
if...else if...else	if (condition1) { ... } else if (condition2) { ... } else { ... }	当你有多个条件需要检查
嵌套的 if...else	if (condition1) { if (condition2) { ... } else { ... } } else { ... }	当你需要在一个条件内部检查其他条件

记住，编程就是练习。不要害怕尝试这些概念。尝试改变例子中的值，看看输出如何变化。这是学习的最好方式！

在我多年的教学经验中，我发现那些玩代码并犯错误的学生学得最快。所以，大胆地去破坏东西，修复它们，在这个过程中享受乐趣吧！

祝编程愉快，未来的程序员们！

Credits: Image by storyset