3.3　使用循环处理重复性任务

有时候，脚本需要一次又一次地重复同样的一系列步骤。例如，假设有一个Web表单，它带有30个文本字段。当用户提交该表单的时候，我们想要确保没有一个字段为空。换句话说，你需要执行同样的一组操作30次，即检查一个表单字段是否为空。既然计算机善于执行重复性的任务，JavaScript包含快速地重复做同样事情的工具就有意义了。

用编程术语来说，重复执行同样的任务叫做循环，由于循环在编程中如此常见，因此JavaScript提供了几种类型的循环。它们都做同样的事情，只不过方式略有不同。

3.3.1　while循环

用while循环重复一段代码，只要一个特定的条件为true；换句话说，只要条件为true。while循环的基本结构如下：

while（condition）{

//javascript to repeat

}

第一行代码引入了while循环。和条件语句一样，我们把条件放置在紧跟while之后的一对圆括号中。条件是可以在条件语句中使用的任何测试，例如x＞10或answer=='yes'。就像条件语句一样，如果条件为true, JavaScript解释器运行开始花括号和结束花括号之间的所有代码。

然而，和条件语句不同，当JavaScript解释器遇到了while语句的结束花括号，它会跳回到while语句的顶部并再次测试条件，而不是继续程序的下一行。如果条件再次为true，解释器再次运行花括号之间的JavaScript代码。这个过程持续到条件不再为true时为止，然后，程序继续循环之后的下一条语句（参见图3-5）。

假设想要在页面上显示数值1～5。做到这一点的一种可能的方式是：

图　3-5　只要测试条件（在这个例子中是x＜10）为真，while循环就运行花括号之间的JavaScript代码

document.write（'Number 1＜br＞'）；

document.write（'Number 2＜br＞'）；

document.write（'Number 3＜br＞'）；

document.write（'Number 4＜br＞'）；

document.write（'Number 5＜br＞'）；

注意，每行代码都几乎相同：每行之间只有数值不同。在这种情况下，循环提供了一种更高效的方式来实现同样的目标：

var num=1；

while（num＜=5）{

document.write（'Number'+num+’＜br＞'）；

num+=1；

}

代码的第一行var num=1不是while循环的一部分：它设置了一个变量来存储要在页面上显示的数值。第二行代码是循环的开始。它设置了测试条件。只要存储在变量num中的数值小于或等于5，花括号之间的代码就会运行。当第一次遇到测试条件，num的值是1，因此测试为true（1小于5），并且document.write（）命令执行，'Number 1＜br＞’显示到页面（＜br＞只是一个HTML分行，确保每一行在Web页面上显示为单独一行）。

提示：编写num=num+1的一种更加紧凑的方式（这只是给存储在num变量中的当前值增加1）如下所示：

num++

这种简写的方法也为变量num加1（参见表2-3了解详细信息）。

循环的最后一行num=num+1非常重要。它不仅把num的值增加到1，以便能够显示下一个数值（例如，2），而且它使得测试条件最终可能变为false（如果觉得+=这样的东西看上去很奇怪，那么，可以回到本书2.5.5节，了解一下它是如何工作的）。只要条件是true, while循环中的JavaScript代码就会重复，因此，我们必须改变条件的一个要素以便条件最终变为false，从而停止循环并转向脚本的下一部分。如果测试条件不会变为false，最终将得到一个所谓的无限循环，即不会终止的程序。注意，如果在循环中漏掉了这一行，将会发生什么：

var num=1；

while（num＜=5）{//this is an endless loop

document.write（'Number'+num+’＜br＞'）；

}

第一次迭代这个循环，测试会询问：1小于等于5吗？答案是肯定的，因此document.write（）运行。在循环的末尾（最后一个花括号），JavaScript解释器回到了循环的开始处并再次测试条件。此时，num仍然是1，因此，条件再次为真，并且再次执行document.write（）。又一次，JavaScript解释器回到了循环的开始处并第三次测试条件。我们可以看看会发生什么情况：无数多行都显示“Number 1”。这个简单的例子还展示了循环所提供的一些灵活性。例如，假设想要显示的数值是1～100，而不是1～5。只需要更改测试条件，而不是加入更多的document.write（）命令的代码行，如下所示：

var num=1；

while（num＜=100）{

document.write（'Number'+num+’＜br＞'）；

num=num+1；

}

现在，循环将会执行100次，向页面显示100行。