JavaScript for 语句
for 语句只要判断条件为 true 就会一直执行
浏览器支持
支持 | 支持 | 支持 | 支持 | 支持 |
语法
for (statement 1; statement 2; statement 3) { // code block to be executed }
参数值
参数 | 描述 |
---|---|
statement1 | 可选。在循环之前执行,用于变量的初始化,初始化多个变量使用逗号隔开(,) 该参数可以省略。但是,不要忽略分号 ";" |
statement2 | 可选。定义执行循环的条件 通常该语句用于条件判断,如果条件为 true, 循环会继续执行,如果为 false,循环终止 该参数可以省略。但是,不要忽略分号 ";"。同样,如果你忽略了该参数,你必须在循环中提供跳出循环的条件。否则语句无限循环,会造成浏览器崩溃 |
statement3 | 可选。在每次循环后执行该语句 通常该语句用于自增或自减计数变量 该参数可以忽略(自增或自减值在循环内操作) |
说明
只要条件为 true,循环就有持续执行,直到条件为 false
JavaScript 支持不同类型的循环
- for - 循环代码块一定的次数
- for/in - 循环遍历对象的属性
- while - 当指定的条件为 true 时循环指定的代码块
- do/while - 同样当指定的条件为 true 时循环指定的代码块
可以使用 break 语句来跳出循环,使用 continue 语句来跳过点前的迭代,并执行下一个迭代。
范例
循环代码块5次
var text = ""; var i; for (i = 0; i < 5; i++) { text += "The number is " + i + "<br>"; }
范例
通过循环数组的索引打印出车名
var cars = ["BMW", "Volvo", "Saab", "Ford"]; var text = ""; var i; for ( i= 0; i < cars.length; i++) { text += cars[i] + "<br>"; }
范例
在第一个参数初始化多个值
var cars = ["BMW", "Volvo", "Saab", "Ford"]; var i; for (i = 0, len = cars.length, text = ""; i < len; i++) { text += cars[i] + "<br>"; }
范例
忽略第一个参数 (在循环前设置值)
var cars = ["BMW", "Volvo", "Saab", "Ford"]; var i = 2; var len = cars.length; var text = ""; for (; i < len; i++) { text += cars[i] + "<br>"; }
范例
使用 continue 语句 - 循环代码块,但跳过 i 等于 "3" 的循环
var text = "" var i; for (i = 0; i < 5; i++) { if (i == 3) { continue; } text += "The number is " + i + "<br>"; }
范例
使用 break 语句 - 循环代码块,但在变量 i 等于 "3" 时退出循环
var text = "" var i; for (i = 0; i < 5; i++) { if (i == 3) { break; } text += "The number is " + i + "<br>"; }
范例
忽略第二个参数。我们同样使用了 break 语句在i 等于 "3" 时退出循环 (如果第二个参数忽略,你必须在循环体内设置跳出循环条件。否则循环无法终止,会导致浏览器崩溃)
var cars = ["BMW", "Volvo", "Saab", "Ford"]; var text = ""; var i; for (i = 0; ; i++) { if (i == 3) { break; } text += cars[i] + "<br>"; }
范例
按递减的方式循环数组的索引
var cars = ["BMW", "Volvo", "Saab", "Ford"]; var text = ""; var i; for (i = cars.length - 1; i >= 0; i--) { text += cars[i] + "<br>"; }
范例
忽略最后一个参数,在循环体内递增值
var cars = ["BMW", "Volvo", "Saab", "Ford"]; var i = 0; var len = cars.length; for (; i < len;) { text += cars[i] + "<br>"; i++; }
范例
循环 NodeList 对象的节点并修改列表中所有 <p> 元素的背景颜色
var myNodelist = document.getElementsByTagName("P"); var i; for (i = 0; i < myNodelist.length; i++) { myNodelist[i].style.backgroundColor = "red"; }
范例
嵌套循环
var text = ""; 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 语句
JavaScript 参考手册: JavaScript break 语句
JavaScript 参考手册: JavaScript continue 语句
JavaScript 参考手册: JavaScript while 语句