流程控制

在 JavaScript 中，流程控制用于决定代码的执行顺序，包括条件判断、循环和跳转。以下是核心知识点的详细解析：

一、条件语句

1. if...else

• 基础语法：

  if (condition) {
    // 条件为真时执行
  } else if (anotherCondition) {
    // 其他条件为真时执行
  } else {
    // 所有条件不满足时执行
  }

• 示例：

  const age = 18;
  if (age >= 18) {
    console.log("成年人");
  } else {
    console.log("未成年人");
  }

2. switch...case

• 匹配规则：
  • 使用 === 严格匹配值。
  • 需要手动添加 break 避免穿透。
• 示例：

  const day = "Monday";
  switch (day) {
    case "Monday":
      console.log("工作日");
      break;
    case "Sunday":
      console.log("周末");
      break;
    default:
      console.log("未知");
  }

二、循环语句

1. for 循环

• 语法：

  for (初始化; 条件; 更新) {
    // 循环体
  }

• 示例：

  for (let i = 0; i < 5; i++) {
    console.log(i); // 0, 1, 2, 3, 4
  }

2. while 循环

• 先判断后执行：

  let count = 0;
  while (count < 3) {
    console.log(count); // 0, 1, 2
    count++;
  }

3. do...while 循环

• 先执行后判断：

  let num = 0;
  do {
    console.log(num); // 0
    num++;
  } while (num > 0);

4. for...in 循环

• 遍历对象属性：

  const obj = { a: 1, b: 2 };
  for (const key in obj) {
    console.log(key, obj[key]); // 'a' 1, 'b' 2
  }

5. for...of 循环

• 遍历可迭代对象（数组、字符串、Map、Set 等）：

  const arr = [10, 20, 30];
  for (const value of arr) {
    console.log(value); // 10, 20, 30
  }

三、跳转语句

1. break

• 退出当前循环或 switch。
• 示例：

  for (let i = 0; i < 5; i++) {
    if (i === 3) break;
    console.log(i); // 0, 1, 2
  }

2. continue

• 跳过当前循环的剩余代码，进入下一次迭代。
• 示例：

  for (let i = 0; i < 5; i++) {
    if (i === 2) continue;
    console.log(i); // 0, 1, 3, 4
  }

3. return

• 终止函数执行并返回值。
• 示例：

  function add(a, b) {
    return a + b;
  }
  const result = add(2, 3); // 5

四、异常处理

1. try...catch...finally

• 捕获和处理错误：

  try {
    // 可能抛出错误的代码
    throw new Error("出错了！");
  } catch (error) {
    console.error("错误信息:", error.message);
  } finally {
    console.log("无论是否出错都会执行");
  }

2. throw

• 手动抛出错误：

  function validateAge(age) {
    if (age < 0) {
      throw new RangeError("年龄不能为负数");
    }
  }

五、流程控制优化

1. 避免嵌套过深：

   // 优化前
   if (condition1) {
     if (condition2) {
       // 逻辑
     }
   }
   
   // 优化后
   if (!condition1) return;
   if (!condition2) return;
   // 逻辑

2. 使用 switch 替代多重 if...else：

   // 优化前
   if (status === 'success') { ... }
   else if (status === 'error') { ... }
   
   // 优化后
   switch (status) {
     case 'success': ... break;
     case 'error': ... break;
   }

3. 利用短路逻辑简化条件：

   const username = user && user.name; // 避免 `user` 为 null/undefined 时报错

六、常见面试题

1. for 和 for...of 的区别？

   • for 是传统循环，需手动控制索引；for...of 直接遍历值，适用于可迭代对象。

2. 如何终止无限循环？

   • 使用 break 或 return，或修改循环条件。

3. switch 中 case 的穿透行为是什么？

   • 如果没有 break，代码会继续执行下一个 case，直到遇到 break 或 switch 结束。

4. 如何处理异步代码中的流程控制？

   • 使用 async/await、Promise 或回调函数。

七、最佳实践

1. 使用描述性变量名：让条件更易理解。

   const isLoggedIn = user && user.token;

2. 提前返回：减少嵌套层级。

   function calculateDiscount(price, isMember) {
     if (!isMember) return price;
     // 会员折扣逻辑
   }

3. 避免 eval()：防止安全风险和性能问题。

4. 使用严格模式：启用 'use strict' 避免隐式全局变量。

通过合理使用流程控制，可以写出结构清晰、易于维护的代码，同时避免常见错误。