JavaScript - For 循环
JavaScript for 循环用于重复执行一段代码，直到指定条件为 false。如果迭代次数固定且已知，则可以将其用于迭代。
JavaScript 循环用于重复执行特定的代码块。for 循环是最紧凑的循环形式。它包含以下三个重要部分
初始化 − 循环初始化表达式用于将计数器初始化为起始值。初始化语句在循环开始前执行。
条件 − 条件表达式将测试给定条件是否为真。如果条件为真，则执行循环内的代码。否则，控件将跳出循环。
迭代 - 迭代表达式是您可以增加或减少计数器的地方。
您可以将所有三个部分放在一行中，并用分号分隔。
流程图
JavaScript 中 for 循环的流程图如下 -
语法
JavaScript 中 for 循环的语法如下 -
for (initialization; condition; iteration) {
条件为真时执行的语句
}
以上所有 3 条语句是可选的。
示例
尝试以下示例，了解 JavaScript 中 for 循环的工作原理。
示例:重复执行代码块
在下面的示例中，我们使用 for 循环打印输出中"count"变量的更新值。在循环的每次迭代中，我们将"count"的值加 1 并打印在输出中。
<html>
<head>
<title> JavaScript - for loop </title>
</head>
<body>
<p id = "output"> </p>
<script>
const output = document.getElementById("output");
output.innerHTML = "Starting Loop <br>";
let count;
for (let count = 0; count < 10; count++) {
output.innerHTML += "Current Count : " + count + "<br/>";
}
output.innerHTML += "Loop stopped!";
</script>
</body>
</html>
输出
Starting Loop Current Count : 0 Current Count : 1 Current Count : 2 Current Count : 3 Current Count : 4 Current Count : 5 Current Count : 6 Current Count : 7 Current Count : 8 Current Count : 9 Loop stopped!
示例:初始化是可选的
以下代码演示了 for 循环中的第一个语句是可选的。您也可以在循环外部初始化变量，并在循环中使用它。
每当您需要使用循环变量时，即使在循环执行完成后，您也可以在循环的父级作用域中初始化变量，就像我们在以下代码中所做的那样。我们还会在循环外部打印 p 的值。
<html>
<head>
<title> Initialization is optional in for loop </title>
</head>
<body>
<p id = "output"> </p>
<script>
let output = document.getElementById("output");
var p = 0;
for (; p < 5; p++) {
output.innerHTML += "P -> " + p + "<br/>";
}
output.innerHTML += "Outside the loop! <br>";
output.innerHTML += "P -> " + p + "<br/>";
</script>
</body>
</html>
Output
P -> 0 P -> 1 P -> 2 P -> 3 P -> 4 Outside the loop! P -> 5
示例:条件语句是可选的
以下代码演示了 for 循环中的条件语句是可选的。但是，如果您不编写任何条件，它将进行无限迭代。因此，您可以在 for 循环中使用"break"关键字来停止循环的执行，就像我们在下面的代码中所做的那样。
<html>
<head>
<title> Conditional statement is optional in for loop </title>
</head>
<body>
<p id = "output"> </p>
<script>
let output = document.getElementById("output");
let arr = [10, 3, 76, 23, 890, 123, 54]
var p = 0;
for (; ; p++) {
if (p >= arr.length) {
break;
}
output.innerHTML += "arr[" + p + "] -> " + arr[p] + "<br/>";
}
</script>
</body>
</html>
Output
arr[0] -> 10 arr[1] -> 3 arr[2] -> 76 arr[3] -> 23 arr[4] -> 890 arr[5] -> 123 arr[6] -> 54
示例:迭代语句是可选的
在 for 循环中，第三条语句也是可选的，用于递增迭代变量。另一种解决方案是，我们可以在循环体内更新迭代变量。
<html>
<head>
<title> Iteration statement is optional </title>
</head>
<body>
<p id = "output"> </p>
<script>
let output = document.getElementById("output");
let str = "Tutorialspoint";
var p = 0;
for (; ;) {
if (p >= str.length) {
break;
}
output.innerHTML += "str[" + p + "] -> " + str[p] + "<br/>";
p++;
}
</script>
</body>
</html>
输出
str[0] -> T str[1] -> u str[2] -> t str[3] -> o str[4] -> r str[5] -> i str[6] -> a str[7] -> l str[8] -> s str[9] -> p str[10] -> o str[11] -> i str[12] -> n str[13] -> t
