Javascript教程

Appearance

JavaScript break 和 continue 语句 ​

break 语句的概念 ​

break 语句用于跳出循环或 switch 语句，终止当前循环的执行并继续执行循环之后的代码。

break 语句的用法 ​

1. 在 for 循环中使用 break ​

javascript
// 当 i 等于 3 时跳出循环
for (let i = 0; i < 10; i++) {
  if (i === 3) {
    break;
  }
  console.log(i);
}

// 输出:
// 0
// 1
// 2

2. 在 while 循环中使用 break ​

javascript
// 当 i 等于 3 时跳出循环
let i = 0;
while (i < 10) {
  if (i === 3) {
    break;
  }
  console.log(i);
  i++;
}

// 输出:
// 0
// 1
// 2

3. 在 switch 语句中使用 break ​

javascript
let fruit = "apple";

switch (fruit) {
  case "apple":
    console.log("Apple");
    break;
  case "banana":
    console.log("Banana");
    break;
  case "orange":
    console.log("Orange");
    break;
  default:
    console.log("Other fruit");
}

// 输出: Apple

4. 在嵌套循环中使用 break ​

break 语句只能跳出当前循环，不能跳出外层循环：

javascript
// 外层循环
for (let i = 0; i < 3; i++) {
  console.log("Outer loop:", i);

  // 内层循环
  for (let j = 0; j < 3; j++) {
    if (j === 1) {
      break; // 只跳出内层循环
    }
    console.log("Inner loop:", j);
  }
}

// 输出:
// Outer loop: 0
// Inner loop: 0
// Outer loop: 1
// Inner loop: 0
// Outer loop: 2
// Inner loop: 0

5. 使用标签跳出外层循环 ​

可以使用标签来跳出外层循环：

javascript
// 定义标签
outerLoop: for (let i = 0; i < 3; i++) {
  console.log("Outer loop:", i);

  for (let j = 0; j < 3; j++) {
    if (j === 1) {
      break outerLoop; // 跳出外层循环
    }
    console.log("Inner loop:", j);
  }
}

// 输出:
// Outer loop: 0
// Inner loop: 0

continue 语句的概念 ​

continue 语句用于跳过当前循环的剩余部分，直接开始下一次循环迭代。

continue 语句的用法 ​

1. 在 for 循环中使用 continue ​

javascript
// 跳过 i 等于 3 的迭代
for (let i = 0; i < 10; i++) {
  if (i === 3) {
    continue;
  }
  console.log(i);
}

// 输出:
// 0
// 1
// 2
// 4
// 5
// 6
// 7
// 8
// 9

2. 在 while 循环中使用 continue ​

javascript
// 跳过 i 等于 3 的迭代
let i = 0;
while (i < 10) {
  i++;

  if (i === 3) {
    continue;
  }

  console.log(i);
}

// 输出:
// 1
// 2
// 4
// 5
// 6
// 7
// 8
// 9
// 10

3. 在 for...in 循环中使用 continue ​

javascript
const person = {
  name: "John",
  age: 30,
  city: "New York",
};

// 跳过 age 属性
for (let key in person) {
  if (key === "age") {
    continue;
  }
  console.log(key + ": " + person[key]);
}

// 输出:
// name: John
// city: New York

4. 在 for...of 循环中使用 continue ​

javascript
const fruits = ["apple", "banana", "orange", "grape"];

// 跳过 banana
for (let fruit of fruits) {
  if (fruit === "banana") {
    continue;
  }
  console.log(fruit);
}

// 输出:
// apple
// orange
// grape

5. 在嵌套循环中使用 continue ​

continue 语句只能跳过当前循环的当前迭代，不能跳过外层循环的迭代：

javascript
// 外层循环
for (let i = 0; i < 3; i++) {
  console.log("Outer loop:", i);

  // 内层循环
  for (let j = 0; j < 3; j++) {
    if (j === 1) {
      continue; // 只跳过内层循环的当前迭代
    }
    console.log("Inner loop:", j);
  }
}

// 输出:
// Outer loop: 0
// Inner loop: 0
// Inner loop: 2
// Outer loop: 1
// Inner loop: 0
// Inner loop: 2
// Outer loop: 2
// Inner loop: 0
// Inner loop: 2

6. 使用标签跳过外层循环的迭代 ​

可以使用标签来跳过外层循环的当前迭代：

javascript
// 定义标签
outerLoop: for (let i = 0; i < 3; i++) {
  for (let j = 0; j < 3; j++) {
    if (j === 1) {
      continue outerLoop; // 跳过外层循环的当前迭代
    }
    console.log("i:", i, "j:", j);
  }
}

// 输出:
// i: 0 j: 0
// i: 1 j: 0
// i: 2 j: 0

break 和 continue 语句的最佳实践 ​

1. 避免过度使用 break 和 continue ​

过度使用 break 和 continue 语句可能会使代码难以理解和维护。在某些情况下，可以通过重构代码来避免使用这些语句：

javascript
// 不好的做法：过度使用 continue
for (let i = 0; i < 10; i++) {
  if (i % 2 === 0) {
    continue;
  }
  if (i > 5) {
    continue;
  }
  console.log(i);
}

// 好的做法：使用单个条件
for (let i = 0; i < 10; i++) {
  if (i % 2 !== 0 && i <= 5) {
    console.log(i);
  }
}

2. 合理使用标签 ​

标签可以用于跳出或跳过嵌套循环，但应该谨慎使用，因为它们可能会使代码难以理解：

javascript
// 好的做法：只在必要时使用标签
outerLoop: for (let i = 0; i < 10; i++) {
  for (let j = 0; j < 10; j++) {
    if (i * j > 20) {
      console.log("Breaking outer loop");
      break outerLoop;
    }
    console.log("i:", i, "j:", j);
  }
}

// 不好的做法：不必要地使用标签
outerLoop: for (let i = 0; i < 5; i++) {
  console.log(i);
}

3. 确保循环变量的更新 ​

在使用 continue 语句时，确保循环变量的更新不会被跳过：

javascript
// 错误：循环变量的更新被跳过，导致无限循环
let i = 0;
while (i < 5) {
  if (i === 2) {
    continue; // 跳过了 i++
  }
  console.log(i);
  i++;
}

// 正确：在 continue 之前更新循环变量
let i = 0;
while (i < 5) {
  i++;
  if (i === 3) {
    continue;
  }
  console.log(i);
}

4. 结合使用 break 和条件语句 ​

在某些情况下，可以结合使用 break 语句和条件语句来优化代码：

javascript
// 好的做法：使用 break 提前退出循环
function findNumber(arr, target) {
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] === target) {
      console.log("Found at index:", i);
      break;
    }
  }
  console.log("Search complete");
}

const numbers = [1, 2, 3, 4, 5];
findNumber(numbers, 3);

// 输出:
// Found at index: 2
// Search complete

break 和 continue 语句的常见错误 ​

1. 在 continue 之后更新循环变量 ​

javascript
// 错误：在 continue 之后更新循环变量，导致循环变量不会递增
for (let i = 0; i < 5; i++) {
  if (i === 2) {
    continue;
  }
  console.log(i);
  // i++ 已经在 for 循环的递增部分执行，这里不需要再执行
}

// 正确：for 循环的递增部分会自动更新循环变量
for (let i = 0; i < 5; i++) {
  if (i === 2) {
    continue;
  }
  console.log(i);
}

2. 在 switch 语句中忘记使用 break ​

javascript
// 错误：在 switch 语句中忘记使用 break，导致穿透
let fruit = "apple";
let color;

switch (fruit) {
  case "apple":
    color = "red";
  case "banana":
    color = "yellow";
    break;
  default:
    color = "unknown";
}

console.log(color); // 输出: yellow（错误，应该是 red）

// 正确：在每个 case 后使用 break
let fruit = "apple";
let color;

switch (fruit) {
  case "apple":
    color = "red";
    break;
  case "banana":
    color = "yellow";
    break;
  default:
    color = "unknown";
}

console.log(color); // 输出: red

3. 无限循环 ​

javascript
// 错误：在 while 循环中使用 break，但条件永远为 true
while (true) {
  console.log("Infinite loop");
  // 没有 break 语句
}

// 正确：在 while 循环中使用 break
let i = 0;
while (true) {
  console.log(i);
  i++;
  if (i === 5) {
    break;
  }
}

小结 ​

break 和 continue 语句是 JavaScript 中用于控制循环执行的重要语句。break 语句用于跳出循环或 switch 语句，而 continue 语句用于跳过当前循环的剩余部分，直接开始下一次循环迭代。在使用这些语句时，应该遵循最佳实践，避免过度使用，合理使用标签，并确保循环变量的更新不会被跳过。

Copyright © 2025-2026 京公网安备 11010102000001号 京ICP备2024078128号-1