JavaScript - Break 语句
JavaScript 中的 break 语句用于终止 loop 或 switch case 语句。当在 loop 中使用 break 语句时,控制流将跳出 loop 并继续执行其他代码。
break 语句还可以在指定的 labeled statement 中用于跳转到该 labeled statement。它是控制 JavaScript 代码执行流程的有用工具。
语法
JavaScript 中 break 语句的语法如下 −
break; OR break [label];
break 语句中的 label 是可选的。
Note 在下一章中,我们将学习在 loop 中与 label 一起使用 break 语句。流程图
break 语句的流程图如下所示 −
示例 (for loop 中的 break 语句)
在下面的示例中,我们使用 for loop 进行迭代。在 loop 中使用 'if' 语句添加了条件表达式。当 'x' 的值为 5 时,将使用 break 语句 'break' 该 loop。
下面的代码仅在输出中打印 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; // 完全跳出 loop
}
output.innerHTML += x + "<br />";
}
output.innerHTML += "Exiting the loop!<br /> ";
</script>
</body>
</html>
输出
Entering the loop. 1 2 3 4 Exiting the loop!
示例 (while loop 中的 break 语句)
下面的代码演示了带有 'break' 语句的 while loop。在 while loop 中,每当 x 的值为 3 或 7 时,将使用 'break' 语句终止 loop。
在代码中,我们在检查条件后更新值。因此,它将首先打印 3,然后在下一次迭代中终止 loop。
<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; // 完全跳出 loop
}
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; // 跳出内层循环
}
output.innerHTML += x + " " + y + "<br />";
}
if (x == 3) {
break; // 跳出外层循环
}
}
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