JavaScript循环和控制结构,if语句可以看作程序执行的交叉路口。根据对数据的判断结果,程序将沿着不同的路径执行语句。
在很多情况下,我们需要反复进行某个操作。如果这种操作的次数是固定的,我们当然可以利用多个if语句,并且利用一个变量进行计数,但代码会变得很乱,而且不易阅读。而且,如果代码段所要重复的次数是不确定的,例如,要重复执行的次数取决于变量中的一个变化的值,那该怎么办呢?
JavaScript提供了多种内置的循环结构可以实现上述目标。
while
while语句的语法与if语句十分类似:
while(this condition is true) {
carry out these statements ...
}
while语句的工作方式也类似于if,唯一的区别在于,在完成一次判断执行之后,while会回到语句的开始,再对条件进行判断。只要条件判断结果为true,while语句就反复执行相应的代码。示例如下:
var count = 10;
var sum = 0;
while(count > 0) {
sum = sum + count;
count--;
}
alert(sum);
只要while判断条件的结果是true,花括号里的语句就会反复执行,也就是不断把count的当前值累加到变量sum中。
当count减少为0时,就不满足条件了,循环就会停止,程序继续执行花括号“}”
后面的语句。这时,变量sum的值为:10 + 9 + 8 + 7 + 6 + 5 + 4 + 3 + 2 + 1 = 55
do…while
do…while
结构在操作上与while很相似,但有一个重要的区别。它的语法如下:
do {
... these statements ...
} while(this condition is true)
真正的区别在于,由于while语句出现在花括号“}”
之后,在进行条件判断之前,代码块会执行一次,因此,do…while
语句里的代码块至少会执行一次。
for
for循环的操作也类似于while,但其语法更复杂一点。在使用for循环时,可以指定初始条件、判断条件(用于结束循环)以及在每次循环后修改计数变量的方式,这些都在一个语句里完成,具体语法如下:
for (x=0; x<10; x++) {
... execute these statements ...
}
这条语句的含义是:“x的初始值设置为0,当x小于10时,每次循环之后把x的值加1,执行相应的代码块”。
现在利用for语句重新编写前面使用while的范例:
var count;
var sum = 0;
for(count = 10; count > 0; count--) {
sum = sum + count;
}
如果没有提前声明计数变量,我们可以在for语句里使用关键字var进行声明。这是一种很简便的方式:
var sum = 0;
for(var count = 10; count > 0; count--) {
sum = sum + count;
}
alert(sum);
与前面使用while的范例一样,当循环结束时,变量sum的值为:10 + 9 + 8 + 7 + 6 + 5 + 4 + 3 + 2 + 1 = 55
用break跳出循环
break语句在循环里的作用与其在switch语句里差不多,即中断循环,把程序导向右花括号后面的第一条语句。
范例如下:
var count = 10;
var sum = 0;
while(count > 0) {
sum = sum + count;
if(sum > 42) break;
count--;
}
alert(sum);
在前面没有break语句的范例里,变量sum的值为:10 + 9 + 8 + 7 + 6 + 5 + 4 + 3 + 2 + 1 = 55
而现在,当sum的值达到10 + 9 + 8 + 7 + 6 + 5 = 45 时,if(sum>42)
的条件就满足了,就会执行break语句而中断循环。
注意:小心无限循环
小心造成无限循环。前面使用的循环是这样的:
while(count > 0) {
sum = sum + count;
count--;
}
假设去掉count--;
这一行,那么每次while判断变量count时,都会发现它的值大于0,因此循环永远不会停止。无限循环会导致浏览器停止响应,产生JavaScript错误,或是导致浏览器崩溃。
用for…in在对象集里循环
for…in
是一种特殊的循环,用于在对象的属性里进行循环。我们用程序中的代码来展示它是如何工作的。
<!DOCTYPE html>
<html>
<head>
<title>Loops and Control</title>
</head>
<body>
<script>
var days = [′Sun′,′Mon′,′Tue′,′Wed′,′Thu′,′Fri′,′Sat′];
var message = "";
for (i in days) {
message += ′Day ′ + i + ′ is ′ + days[i] + ′\n′;
}
alert(message);
</script>
</body>
</html>
在这种循环中,我们不必考虑使用循环计数器,或是判断循环结束的条件。循环会对集合中的每个对象(本例中是数组元素)执行一次,然后结束。
上述范例代码的执行结果如图所示。
说明:
在JavaScript中,数组是一种对象。利用for…in循环可以操作任何对象的属性,无论是DOM对象、JavaScript内建对象还是我们创建的对象。
酷客网相关文章:
评论前必须登录!
注册