循环可以将代码块执行指定的次数。
如果您希望一遍又一遍地运行相同的代码,并且每次的值都不同,那么使用循环是很方便的。
在没有循环语句的情况下,我们必须这样输出数组的值:
<script>
cars = ["Rolls-Royce", "Bentley", "Porsche", "Ferrari", "Lamborghini", "McLaren"]
document.write(cars[0] + "<br>");
document.write(cars[1] + "<br>");
document.write(cars[2] + "<br>");
document.write(cars[3] + "<br>");
document.write(cars[4] + "<br>");
document.write(cars[5] + "<br>");
</script>
如果要循环1000遍,就得写1000次,如果这样,就没有人喜欢编程了
每个编程语言都提供了循环语句结构,比如使用for循环
<script>
cars = ["Rolls-Royce", "Bentley", "Porsche", "Ferrari", "Lamborghini", "McLaren"]
for (var i=0; i<cars.length; i++)
{
document.write(cars[i] + "<br>");
}
</script>
不同类型的循环
JavaScript 支持不同类型的循环:
for
- 循环代码块一定的次数for/in
- 循环遍历对象的属性while
- 当指定的条件为 true 时循环指定的代码块do/while
- 同样当指定的条件为 true 时循环指定的代码块
for 循环语句
for 循环是在javascript中创建循环时常会用到的语句结构。
下面是 for 循环的语法:
for (语句 1; 语句 2; 语句 3) {
被执行的代码块
}
语句 1 循环开始前执行,初始化变量
语句 2 定义运行循环条件,在条件满足的情况下循环
语句 3 每一轮循环执行之后执行该部分
for循环实例
<script>
for (var i=0; i<5; i++)
{
document.write("该数字为 " + i + "<br>");
}
</script>
从上面的例子中,您可以看到:
语句 1:在循环开始之前设置变量 (var i=0)。
语句 2:定义循环运行的条件(i 必须小于 5)。
语句 3:在每次代码块已被执行后增加一个值 (i++)。
语句1 部分
语句 1 初始化循环中所用的变量 (var i=0
)。
语句 1 是可选的,也就是说不使用语句 1 也可以。
省略语句1部分实例
<script>
var i = 0;
for (; i < 5; i++){
x = "该数字为 " + i;
document.write(x + "<br>")
}
</script>
您可以在语句 1 中初始化任意(或者多个)值。
语句1部分定义多个变量实例
定义了width、height两个变量
<script>
for (var height=0, width=100; height<10; height++)
{
document.write("s=" + (height * width) + "<br>");
}
</script>
语句2 部分
通常语句 2 用于判断循环是否继续循环条件。
如果语句 2 返回 true
,则循环再次开始,如果返回 false
,则循环将结束。
语句 2 同样是可选的。
如果您省略了语句 2,那么必须在循环内提供 break。否则循环就无法停下来。
语句3 部分
语句 3 通常用于放置改变循环变量的语句。
语句 3 也是可选的。
语句3省略实例
<script>
for (var i=0; i<len; ){
document.write("i=" + i +"<br>");
i++;
}
</script>
语句 3 也可以同时设定多个变量
同时设定多个变量实例
<script>
for (var height=0, width=0; width * height<100; height++, width++)
{
document.write("s="+(height * width) + "<br>");
}
</script>
for/in 循环
for...in 语句通常用于循环遍历对象的属性
for/in循环实例
<script>
var Bill={fname:"Bill",lname:"Gates",age:56};
for (x in Bill) // x 为属性名
{
document.write("Bill's " + x + ":" + Bill[x] + "<br>")
}
</script>
讨论区