JS For 循环

创建于 2024-12-03 / 23

字体： [默认] [大] [更大]

循环可多次执行代码块。

JavaScript 循环

假如您需要运行代码多次，且每次使用不同的值，那么循环（loop）相当方便使用。

通常我们会遇到使用数组的例子:

不需要这样写:

text += cars[0] + " ";
text += cars[1] + " ";
text += cars[2] + " ";
text += cars[3] + " ";
text += cars[4] + " ";
text += cars[5] + " ";

您能够这样写:

var i;
for (i = 0; i < cars.length; i++) {
text += cars[i] + " ";
} 亲自试一试 »

不同类型的循环

JavaScript 支持不同类型的循环:

for - 多次遍历代码块
for/in - 遍历对象属性
for/of - 循环遍历 iterable 对象的值
while - 当指定条件为 true 时循环一段代码块
do/while - 当指定条件为 true 时循环一段代码块

For 循环

for 循环是在您希望创建循环时经常使用的工具。

for 循环的语法如下:

for (statement 1; statement 2; statement 3) {
// 要执行的代码块
}

语句 1 在循环（代码块）开始之前执行。

语句 2 定义运行循环（代码块）的条件。

语句 3 会在循环（代码块）每次被执行后执行。

实例

for (i = 0; i < 5; i++) {
text += "The number is " + i + " ";
}
亲自试一试 »

从上面的代码中，您可以了解到:

语句 1 在循环开始之前设置了一个变量（var i = 0）。

语句 2 定义运行循环的条件（i 必须小于 5）。

语句 3 会在代码块每次执行之后对值进行递增（i++）。

语句 1

通常，您会使用语句 1 来初始化循环中所使用的的变量（i = 0）。

但情况并不总是这样，JavaScript 不会在意。语句 1 是可选的。

您可以在语句 1 中初始化多个值（由逗号分隔）:

实例

for (i = 0, len = cars.length, text = ""; i < len; i++) {
text += cars[i] + " ";
} 亲自试一试 »

而且您还可以省略语句 1（比如在循环开始前设置好值）:

实例

var i = 2;
var len = cars.length;
var text = "";
for (; i < len; i++) {
text += cars[i] + " ";
} 亲自试一试 »

语句 2

通常语句 2 用于计算初始变量的条件。

但情况并不总是这样，JavaScript 不会在意。语句 2 也是可选的。

如果语句 2 返回 true，那么循环会重新开始，如果返回 false，则循环将结束。

如果省略语句 2，那么必须在循环中提供一个 break。否则循环永远不会结束。请在下一章阅读更多关于 break 的内容。

语句 3

通常语句 3 会递增初始变量的值。

但情况并不总是这样，JavaScript 不会在意。语句 3 也是可选的。

语句 3 可做任何事情，比如负递增（i--），正递增（i = i + 15），或者任何其他事情。

语句 3 也可被省略（比如当您在循环内递增值时）:

实例

var i = 0;
var len = cars.length;
for (; i < len; ) {
text += cars[i] + " ";
i++;
} 亲自试一试 »

For/In 循环

JavaScript for/in 语句遍历对象的属性:

实例

var person = {fname:"John", lname:"Doe", age:25};

var text = "";
var x;
for (x in person) {
text += person[x];
} 亲自试一试 »

For/Of 循环

JavaScript for/of 语句循环遍历 iterable 对象的值。

for/of 让您可以循环遍历可编辑的数据结构，例如数组、字符串、映射、节点列表等。

for/of 循环具有以下语法:

for (variable of iterable) {
// 要执行的代码块
}

变量（variable） - 对于每次迭代，下一个属性的值都被分配给变量。变量可以用const, let, 或 var声明。

iterable - 具有 iterable 属性的对象。

数组循环实例

实例

var cars = ["BMW", "Volvo", "Mini"];
var x;

for (x of cars) {
document.write(x + " ");
} 亲自试一试 »

字符串循环实例

实例

var txt = "JavaScript";
var x;

for (x of txt) {
document.write(x + " ");
} 亲自试一试 »

While 循环

我们将在下一章学习 while 循环和 do/while 循环。

学习训练

练习题:

创建一个从0到9的循环。

var i;
 ( = ;  < ; ) {
  console.log(i);
}

开始练习

0 人点赞过