循环语句用于重复执行某个操作,它有多种形式。
while 循环
While语句包括一个循环条件和一段代码块,只要条件为真,就不断循环执行代码块。
while (expression) //表达式
statement; //语句
// 或者
while (expression) statement;
// 或者
while (expression) {
statement;
}
for 循环
for语句是循环命令的另一种形式,可以指定循环的起点、终点和终止条件。
for (initialize; test; increment)
statement
// 或者
for (initialize; test; increment) {
statement
}
- 初始化表达式(initialize):确定循环的初始值,只在循环开始时执行一次。
- 测试表达式(test):检查循环条件,只要为真就进行后续操作。
- 递增表达式(increment):完成后续操作,然后返回上一步,再一次检查循环条件。
var x = 3;
for (var i = 0; i < x; i++) {
console.log(i);
}
// 0
// 1
// 2
所有for循环,都可以改写成while循环。
var x = 3;
var i = 0;
while (i < x) {
console.log(i);
i++;
}
for语句的三个部分(initialize,test,increment),可以省略任何一个,也可以全部省略。
for ( ; ; ){
console.log('Hello World');
}
上面代码省略了for语句表达式的三个部分,结果就导致了一个无限循环。
do…while循环
do...while循环与while循环类似,唯一的区别就是先运行一次循环体,然后判断循环条件。
do
statement
while (expression);
// 或者
do {
statement
} while (expression);
不管条件是否为真,do..while循环至少运行一次。

break语句和continue语句
break语句和continue语句都具有跳转作用,可以让代码不按既有的顺序执行。
break语句用于跳出代码块或循环:

上面代码只会执行5次循环,一旦i等于5,就会跳出循环。
for循环也可以使用break语句跳出循环。

continue语句用于立即终止本轮循环,返回循环结构的头部,开始下一轮循环。

上面的例子,第一个,当i为偶数时,执行console.log;第二个,当i为偶数时,continue,终止本轮循环,回到头部开始下一轮,为奇数时,执行console.log。
TODO:如果存在多重循环,不带参数的break语句和continue语句都只针对最内层循环?
标签(label)
JavaScript语言允许,语句的前面有标签(label),相当于定位符,用于跳转到程序的任意位置,标签的格式如下:
label:
statement
标签可以是任意的标识符,但是不能是保留字,语句部分可以是任意语句。
标签通常与break语句和continue语句配合使用,跳出特定的循环。
break:

例子中可以看出,使用标签,top,循环则会从最上面的for语句重新开始;
普通的例子中,break后,则是从最近的父级for语句开始,会将符合条件的 i 全都执行完。
continue:

网友评论