JavaScript 控制流语句详解

 

1. if, else if, else

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

?

1 2 3 4 5 6 7

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

　　

示例：

?

1 2 3 4 5 6 7 8

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

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

?

1 2 3 4 5 6 7 8 9 10

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

　　

示例：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14

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

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

?

1 2 3

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

　　

示例：

?

1 2 3 4 5

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

　

补充说明：

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

---

4. do...while

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

?

1 2 3

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

　　

示例：

?

1 2 3 4 5

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

　　

补充说明：

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

---

5. for

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

?

1 2 3

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

　　

示例：

?

1 2 3

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

 

补充说明：

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

---

6. for...in

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

?

1 2 3

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

 

示例：

?

1 2 3 4

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等）中的元素。
语法：

?

1 2 3

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

　　

示例：

?

1 2 3 4

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：跳过当前循环的剩余部分，并继续下一次循环。
  示例：

?

1 2 3 4 5 6 7 8 9 10 11

// 使用 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 可用于跳过某些不符合条件的迭代，提高代码效率。

---

总结

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