JavaScript - break 语句

JavaScript 中的break语句用于终止循环或switch case语句。当与循环一起使用时，控制流将跳出循环并继续执行其他代码。

break语句也可以用于在带标签的语句内部跳出带标签的语句。它是控制 JavaScript 代码执行流程的有用工具。

语法

JavaScript 中 break 语句的语法如下：

break;
OR
break [label];

break 语句中的标签是可选的。

注意 - 在下一章中，我们将学习如何在循环内部使用带标签的 break 语句。

流程图

break 语句的流程图如下所示：

示例（for 循环中的 break 语句）

在下面的示例中，我们使用 for 循环进行迭代。我们使用 'if' 语句在循环中添加了条件表达式。当 'x' 的值为 5 时，它将使用 break 语句中断循环。

下面的代码只打印 1 到 4 的值。

<html>
<head>
   <title> JavaScript - Break statement </title>
</head>
<body>
   <p id = "output"> </p>
   <script>
      const output = document.getElementById("output");
      output.innerHTML += "Entering the loop. <br /> ";
      for (let x = 1; x < 10; x++) {
         if (x == 5) {
            break;   // breaks out of loop completely
         }
            output.innerHTML += x + "<br />";
      }
      output.innerHTML += "Exiting the loop!<br /> ";
   </script>
</body>
</html>

输出

Entering the loop.
1
2
3
4
Exiting the loop!

示例（while 循环中的 break 语句）

下面的代码演示了带有 'break' 语句的 while 循环。在 while 循环中，无论 x 的值为 3 还是 7，它都将使用 'break' 语句终止循环。

在代码中，我们在检查条件后更新值。因此，它将首先打印 3，然后在下一次迭代中终止循环。

<html>
<head>
   <title> JavaScript - Break statement </title>
</head>
<body>
   <p id = "output"> </p>
   <script>
      let output = document.getElementById("output");
      var x = 1;
      output.innerHTML += "Entering the loop. <br /> ";
      while (x < 10) {
         if (x == 3 || x == 7) {
            break;   // breaks out of loop completely
         }
         x = x + 1;
         output.innerHTML += x + "<br />";
      }
      output.innerHTML += "Exiting the loop!<br /> ";
   </script>
</body>
</html>

输出

Entering the loop.
2
3
Exiting the loop!

嵌套循环中的 break 语句

当您有嵌套循环时，可以使用 'break' 语句跳出任何循环。例如，如果您在父循环中使用 'break' 语句，则代码也将终止所有嵌套循环的迭代。在嵌套循环中使用 'break' 语句将只终止嵌套循环。

示例

在下面的示例中，x 是父循环的循环变量，y 是子循环的循环变量。

在嵌套循环中，每当 y 变成 3 时，它将中断循环；在外循环中，每当 x 变成 3 时，它将中断循环。您不会在输出中看到 x > 3 或 y > 2。

<html>
<head>
   <title> JavaScript - Break statement </title>
</head>
<body>
   <p id = "output"> </p>
   <script>
      const output = document.getElementById("output");
      output.innerHTML += "Entering the loop. <br /> ";
      for (let x = 1; x < 10; x++) {
         for (let y = 1; y < 10; y++) {
            if (y == 3) {
               break; // breaks inner loop
            }
            output.innerHTML += x + " " + y + "<br />";
         }
         if (x == 3) {
            break; // break outer loop
         }
      }
      output.innerHTML += "Exiting the loop!<br /> ";
   </script>
</body>
</html>

输出

Entering the loop.
1 1
1 2
2 1
2 2
3 1
3 2
Exiting the loop!

switch case 语句中的 break 语句

switch case 语句根据条件表达式执行多个代码块中的一个。'break' 语句在将一个或多个 case 与条件表达式的值匹配后终止 switch case 语句。

示例

在下面的代码中，我们使用每个 case 的 'break' 语句。这里，变量 p 的值作为 switch case 语句的条件表达式。它与 'case 10' 匹配。因此，代码将执行该特定代码块并使用 'break' 语句终止 switch case 语句。

<html>
<head>
   <title> JavaScript - Break statement </title>
</head>
<body>
   <p id = "output"> </p>
   <script>
      const output = document.getElementById("output");
      var p = 10;
      switch (p) {
         case 10:
            output.innerHTML = "p is 10";
            break;
         case 20:
            output.innerHTML = "p is 20";
            break;
         case 30:
            output.innerHTML = "p is 30";
            break;
         default:
            output.innerHTML = "p is not 10, 20 or 30";
      }
   </script>
</body>
</html>

输出

p is 10

打印页面