在本教程中,您将借助示例了解 JavaScript 中的循环和 for 循环。
在编程中,循环用于重复一段代码。
例如,如果您想显示一条消息 100 次,那么您可以使用循环。这只是一个简单的例子;你可以用循环实现更多。
本教程重点介绍 JavaScriptfor循环。您将在接下来的教程中了解其他类型的循环。
JavaScript for 循环
for循环的语法是:
for (initialExpression; condition; updateExpression) {
// for loop body
}
这里,
- initialExpression 初始化和/或声明变量,并且只执行一次。
- 评估 condition
- 如果条件为 false,则终止 for 循环。
- 如果条件为 true,则执行 for 循环内的代码块。
- 当条件为 true 时,updateExpression 更新 initialExpression 的值。
- 再次评估 condition。此过程将继续,直到条件为 false。
要了解有关条件的更多信息,请访问JavaScript 比较和逻辑运算符。
示例 1:显示文本五次
// program to display text 5 times
const n = 5;
// looping from i = 1 to 5
for (let i = 1; i <= n; i++) {
console.log(`I love JavaScript.`);
}
输出
I love JavaScript.
I love JavaScript.
I love JavaScript.
I love JavaScript.
I love JavaScript.
这是该程序的工作原理。
迭代次数 | 变量 | 条件:i <= n | 行为 |
---|---|---|---|
1st | i = 1 n = 5 | true | 打印 I love JavaScript. i 增加到 2。 |
2nd | i = 2 n = 5 | true | 打印 I love JavaScript. i 增加到 3。 |
3rd | i = 3 n = 5 | true | 打印 I love JavaScript. i 增加到 4。 |
4th | i = 4 n = 5 | true | 打印 I love JavaScript. i 增加到 5。 |
5th | i = 5 n = 5 | true | 打印 I love JavaScript. i 增加到 6。 |
6th | i = 6 n = 5 | false | 循环终止。 |
示例 2:显示从 1 到 5 的数字
// program to display numbers from 1 to 5
const n = 5;
// looping from i = 1 to 5
// in each iteration, i is increased by 1
for (let i = 1; i <= n; i++) {
console.log(i); // printing the value of i
}
输出
1
2
3
4
5
这是该程序的工作原理。
迭代次数 | 变量 | 条件:i <= n | 行为 |
---|---|---|---|
1st | i = 1 n = 5 | true | 打印 1. i 增加到 2。 |
2nd | i = 2 n = 5 | true | 打印 2. i 增加到 3。 |
3rd | i = 3 n = 5 | true | 打印 3. i 增加到 4。 |
4th | i = 4 n = 5 | true | 打印 4. i 增加到 5。 |
5th | i = 5 n = 5 | true | 打印 5. i 增加到 6。 |
6th | i = 6 n = 5 | false | 循环终止。 |
示例 3:显示 n 个自然数的总和
// program to display the sum of natural numbers
let sum = 0;
const n = 100
// looping from i = 1 to n
// in each iteration, i is increased by 1
for (let i = 1; i <= n; i++) {
sum += i; // sum = sum + i
}
console.log('sum:', sum);
输出
sum: 5050
这里,sum 的值最初为 0。然后,for 循环从 i=1 迭代到 100。在每次迭代中,i 被加到 sum 中,其值增加 1。
当 i 变为101时,测试条件为 false,sum 将等于 0 + 1 + 2 + … + 100。
上面的自然数相加程序也可以写成
// program to display the sum of n natural numbers
let sum = 0;
const n = 100;
// looping from i = n to 1
// in each iteration, i is decreased by 1
for(let i = n; i >= 1; i-- ) {
// adding i to sum in each iteration
sum += i; // sum = sum + i
}
console.log('sum:',sum);
该程序还提供与示例 3 相同的输出。在编程中,你可以用许多不同的方式完成同样的任务;编程就是逻辑。
尽管这两种方法都是正确的,但您应该尝试使代码更具可读性。
JavaScript 无限循环
如果 for 循环中的测试条件总是 true,它会永远运行(直到内存已满)。例如,
// infinite for loop
for(let i = 1; i > 0; i++) {
// block of code
}
在上面的程序中,条件始终为 true,然后将无限次运行代码。
在下一个教程中,您将了解 while 和 do…while 循环。
上一教程 :JS if…else 下一教程 :JS while Loop
参考文档
[1] Parewa Labs Pvt. Ltd. (2022, January 1). Getting Started With JavaScript, from Parewa Labs Pvt. Ltd: https://www.programiz.com/javascript/for-loop