JavaScript 控制流语句详解

 

1. if, else if, else

用途：用于条件判断。
语法：

if (condition1) {
    // 当 condition1 为 true 时执行的代码块
} else if (condition2) {
    // 当 condition1 为 false 且 condition2 为 true 时执行的代码块
} else {
    // 当所有条件都为 false 时执行的代码块
}

　　

示例：

let num = 5;
if (num > 10) {
    console.log("大于10");
} else if (num < 5) {
    console.log("小于5");
} else {
    console.log("等于5");
}

　　

补充说明：

• if 语句是最基本的条件判断语句，适用于简单的逻辑判断。
• else if 和 else 用于处理多个条件分支，代码结构清晰，逻辑层次分明。
• 在实际开发中，if 语句可以与逻辑运算符（&&, ||）结合使用，简化条件判断。

---

2. switch, case, default

用途：提供多分支选择结构，适用于多个可能值的情况。
语法：

switch (expression) {
    case value1:
        // 当 expression 等于 value1 时执行的代码块
        break;
    case value2:
        // 当 expression 等于 value2 时执行的代码块
        break;
    default:
        // 当 expression 不匹配任何 case 时执行的代码块
}

　　

示例：

let day = 3;
switch (day) {
    case 1:
        console.log("星期一");
        break;
    case 2:
        console.log("星期二");
        break;
    case 3:
        console.log("星期三");
        break;
    default:
        console.log("未知的日期");
}

　　

补充说明：

• switch 语句适用于变量有多个固定值的情况，比多个 if...else if 更清晰。
• 每个 case 后的 break 是必须的，否则会执行后续的代码块（称为“穿透”）。
• default 是可选的，但建议始终添加，以处理意外情况。

---

3. while

用途：当条件为真时重复执行一个代码块。
语法：

while (condition) {
    // 当 condition 为 true 时循环执行的代码块
}

　　

示例：

let i = 0;
while (i < 5) {
    console.log(i);
    i++;
}

　

补充说明：

• while 循环在每次迭代前检查条件，因此如果条件初始为 false，循环体可能一次也不执行。
• 适用于循环次数不确定的情况，例如读取用户输入或处理动态数据。

---

4. do...while

用途：类似于 while，但会至少执行一次循环体，然后再检查条件。
语法：

do {
    // 至少执行一次的代码块
} while (condition);

　　

示例：

let j = 0;
do {
    console.log(j);
    j++;
} while (j < 5);

　　

补充说明：

• do...while 循环至少执行一次循环体，适合需要至少执行一次操作的场景。
• 例如，用户登录时至少提示一次输入，无论输入是否正确。

---

5. for

用途：提供一种简洁的方式来编写循环。
语法：

for (initialization; condition; increment) {
    // 循环体
}

　　

示例：

for (let k = 0; k < 5; k++) {
    console.log(k);
}

 

补充说明：

• for 循环是 JavaScript 中最常用的循环结构，适用于循环次数已知的情况。
• 可以通过 break 和 continue 控制循环的执行。

---

6. for...in

用途：遍历对象的可枚举属性。
语法：

for (variable in object) {
    // 对每个属性执行的操作
}

 

示例：

let obj = {a: 1, b: 2, c: 3};
for (let prop in obj) {
    console.log(prop + ": " + obj[prop]);
}

补充说明：

• for...in 遍历对象的所有可枚举属性，包括继承的属性。
• 如果只想遍历对象自身的属性，可以结合 Object.hasOwnProperty() 方法使用。

---

7. for...of

用途：遍历可迭代对象（如数组、字符串、Map、Set等）中的元素。
语法：

for (variable of iterable) {
    // 对每个元素执行的操作
}

　　

示例：

let arr = [1, 2, 3];
for (let element of arr) {
    console.log(element);
}

　　

补充说明：

• for...of 是 ES6 引入的语法，用于遍历可迭代对象的值。
• 与 for...in 不同，for...of 不会遍历对象的键，而是直接获取值。
• 适用于数组、字符串、Map 和 Set 等数据结构。

---

8. break 和 continue

• break：立即退出当前循环或 switch 语句。
• continue：跳过当前循环的剩余部分，并继续下一次循环。
  示例：

// 使用 break
for (let l = 0; l < 10; l++) {
    if (l === 5) break;
    console.log(l); // 输出 0 到 4
}

// 使用 continue
for (let m = 0; m < 10; m++) {
    if (m % 2 === 0) continue;
    console.log(m); // 输出 1, 3, 5, 7, 9
}

　　

补充说明：

• break 和 continue 是控制循环执行的重要语句。
• break 可用于提前退出循环，避免不必要的计算。
• continue 可用于跳过某些不符合条件的迭代，提高代码效率。

---

总结

这些控制流语句提供了灵活的方式来控制程序的执行流程。根据不同的需求，您可以选择合适的语句来实现逻辑判断和循环操作。每种语句都有其特定的使用场景，掌握它们可以大大提高编写高效、清晰代码的能力。在实际开发中，合理使用这些语句可以优化代码结构，提高代码的可读性和可维护性。