JavaScript for 语句
实例
循环代码块五次：
var i;
for (i = 0; i < 5; i++) {
text += "The number is " + i + "<br>";
}
页面下方有更多实例。
定义和用法
for 语句创建循环，只要条件为真就执行该循环。
只要条件为真，循环就会继续运行。只有当条件变为假时它才会停止。
JavaScript 支持不同类型的循环：
- for - 多次循环代码块
- for/in - 遍历对象的属性
- for/of - 循环遍历可迭代对象的值
- while - 在指定条件为真时循环代码块
- do/while - 循环一次代码块，然后在指定条件为真时重复循环
提示： 请使用 break 语句跳出循环，使用 continue 语句跳过循环中的某个值。
浏览器支持
| 语句 | |||||
|---|---|---|---|---|---|
| for | Yes | Yes | Yes | Yes | Yes |
语法
code block to be executed
}
参数值
| 参数 | 描述 |
|---|---|
| statement1 |
可选。在循环（代码块）开始之前执行。通常此语句用于初始化计数器变量。如需初始化多个值，请用逗号分隔每个值。 注释：该参数可以省略。但是，不要省略分号 ";" |
| statement2 |
可选。定义运行循环（代码块）的条件。通常此语句用于评估计数器变量的条件。如果返回 true，循环将重新开始，如果返回 false，循环将结束。 注释：该参数可以省略。但是，不要省略分号 ";"。此外，如果省略此参数，则必须在循环内提供 break。否则循环将永远不会结束，这将使您的浏览器崩溃。 |
| statement3 |
可选。每次执行循环（代码块）后执行。通常此语句用于递增或递减计数器变量。 注释：这个参数可以省略（例如增加/减少循环内的值）。 |
技术细节
| JavaScript 版本: | ECMAScript 1 |
|---|
更多实例
实例
循环遍历数组的索引，从 cars 数组中收集汽车名称：
var text = "";
var i;
for (i = 0; i < cars.length; i++) {
text += cars[i] + "<br>";
}
实例解析:
- 首先，我们在循环开始之前设置一个变量（var i = 0;）
- 然后，我们定义循环运行的条件。只要变量小于数组的长度（即 4），循环就会继续
- 每次循环执行时，变量加一 (i++)
- 一旦变量不再小于 4（数组的长度），条件为假，循环结束
实例
在第一个参数中初始化多个值：
var i;
for (i = 0, len = cars.length, text = ""; i < len; i++) {
text += cars[i] + "<br>";
}
实例
省略第一个参数（在循环开始之前设置值）：
var i = 2;
var len = cars.length;
var text = "";
for (; i < len; i++) {
text += cars[i] + "<br>";
}
实例
使用 continue 语句 - 循环代码块，但跳过 "3" 这个值：
var i;
for (i = 0; i < 5; i++) {
if (i == 3) {
continue;
}
text += "The number is " + i + "<br>";
}
实例
使用 break 语句 - 循环一段代码，但当变量 i 等于 "3" 时退出循环：
var i;
for (i = 0; i < 5; i++) {
if (i == 3) {
break;
}
text += "The number is " + i + "<br>";
}
实例
省略第二个参数。在这个例子中，我们也使用 break 语句在 i 等于 "3" 时退出循环（如果省略第二个参数，则必须在循环内提供一个 break。否则循环将永远不会结束，您的浏览器将奔溃）：
var text = "";
var i;
for (i = 0; ; i++) {
if (i == 3) {
break;
}
text += cars[i] + "<br>";
}
实例
按降序循环遍历数组的索引（负递增）：
var text = "";
var i;
for (i = cars.length - 1; i >= 0; i--) {
text += cars[i] + "<br>";
}
实例
省略最后一个参数，并在循环内递增值：
var i = 0;
var len = cars.length;
for (; i < len;) {
text += cars[i] + "<br>";
i++;
}
实例
循环遍历 NodeList 对象的节点并更改列表中所有 <p> 元素的背景颜色：
var i;
for (i = 0; i < myNodelist.length; i++) {
myNodelist[i].style.backgroundColor = "red";
}
实例
嵌套循环的例子（循环内的循环）：
var i, j;
for (i = 0; i < 3; i++) {
text += "<br>" + "i = " + i + ", j = ";
for (j = 10; j < 15; j++) {
document.getElementById("demo").innerHTML = text += j + " ";
}
}
相关页面
JavaScript 教程: JavaScript For 循环
JavaScript 参考手册: JavaScript for ... in Statement
JavaScript 参考手册: JavaScript break 语句
JavaScript 参考手册: JavaScript continue 语句
JavaScript 参考手册: JavaScript while 语句
