英文 | https://www.javascripttutorial.net/
译文 | 杨小爱
在上节中，我们学习了JavaScript 程序流程中的do while语句，错过的小伙伴可以点击文章《【JavaScript 教程】第四章 程序流程05— JavaScript do-while 循环语句》进行学习。
那么，在今天的教程中，我们将一起来学习如何使用 JavaScriptfor循环语句创建具有各种选项的循环。
JavaScript for 循环语句简介
JavaScript for 循环语句，允许您使用三个可选表达式创建循环。下面说明了for循环语句的语法：
for (initialization; condition; post-expression) {
// statements
}1) 初始化
初始化表达式初始化循环。初始化表达式仅在循环开始时执行一次。您通常使用的初始化是初始化一个计数器变量。如果使用 var 关键字声明计数器变量，则该变量将具有函数或全局作用域。
换句话说，您可以在循环结束后引用计数器变量。但是，如果您使用 let 关键字来声明计数器变量，则该变量将具有阻塞作用域，该作用域只能在循环内部访问。
2) 条件
condition是在每次迭代之前计算一次的表达式。只有当condition评估为true时才执行循环内的语句。如果condition评估为false，则循环终止。请注意，condition是可选的。如果省略它，for 循环语句会将其视为true。
3）后表达
for 循环语句还在每次循环迭代后计算后表达式。通常，您使用后表达式来更新计数器变量。以下流程图说明了 for 循环：
在for循环中，这三个表达式是可选的。下面显示了如何在for没有任何表达式的情况下使用循环：
for ( ; ; ) {
// statements
}JavaScriptfor循环示例
让我们举一些使用for循环的例子。
1) 、简单for循环示例
以下示例使用for循环语句，在控制台窗口中显示从 1 到 5 的数字。
for (var counter = 1; counter < 5; counter++) {
console.log('Inside the loop:' + counter);
}
console.log('Outside the loop:' + counter);输出：
Inside the loop:1
Inside the loop:2
Inside the loop:3
Inside the loop:4
Outside the loop:5
它是怎么运作。
- 首先，声明一个变量 counter 并将其初始化为 1。
- 其次，如果 counter 小于 5，则在 Console 窗口中显示 counter 的值。
- 第三，在循环的每次迭代中将 counter 的值加 1。
由于 for 循环使用 var 关键字来声明 counter，counter 的作用域是全局的。因此，我们可以在循环结束后访问计数器变量。在 ES6 中，您可以使用 let 关键字来声明循环本地的计数器变量。
for (let counter = 1; counter < 5; counter++) {
console.log('Inside the loop:' + counter);
}
console.log('Outside the loop:' + counter);错误：
ReferenceError: counter is not defined
counter在循环后访问变量导致ReferenceError.
2)、for没有初始化部分的循环例子
下面的例子使用了一个for省略初始化部分的循环：
var j = 1;
for (; j < 10; j += 2) {
console.log(j);
}
输出：
1
3
5
7
9
3)、 没有条件的 for 循环示例
与initialization表达式类似，condition 表达式是可选的。如果省略条件表达式，则需要使用 break 语句来终止循环。
for (let j = 1;; j += 2) {
console.log(j);
if (j > 10) {
break;
}
}输出：
1
3
5
7
9
11
4) 、没有任何表达式的for循环示例
for 循环语句的所有三个表达式都是可选的，因此您可以省略所有它们。同样，您必须使用 break 语句来终止循环，并修改 counter 变量以使 break 语句的条件在某个时刻变为true。
// initialize j variable
let j = 1;
for (;;) {
// terminate the loop if j is greater than 10;
if (j > 10) break;
console.log(j);
// increase the counter j
j += 2;
}
输出：
1
3
5
7
9
5）、没有循环体的for循环示例
有趣的是，for 语句可以有一个空语句。在这种情况下，您在 for 语句之后立即放置一个分号 (;)。以下示例计算从 1 到 10 的数字的总和。
表达式位于post-expression，因此，它在循环体中使用空语句。
let sum = 0;
for (let i = 0; i <= 9; i++, sum += i);
console.log(sum);
输出：
55
总结
通过本教程的学习，我们知道了如何使用 JavaScriptfor循环语句创建具有各种选项的循环。
学习更多技能
请点击下方公众号
