深入理解 JavaScript 循环：从基础到应用

在 JavaScript 中，只要给定条件得到满足，循环就允许我们多次执行同一段代码块。它们可以帮助我们减少代码的重复编写，使程序更加高效且结构清晰。

• 只要条件为真，循环就会一直运行下去，直到条件变为假。
• 它们非常适合用来遍历数组、字符串以及一系列数值。

在 JavaScript 中，主要有三种类型的循环：

1. for 循环

for 循环 会将一段代码重复执行特定的次数。它在一行代码中包含了初始化、条件判断以及增加/减少操作。
语法

for (初始化; 条件; 增量/减量)  {         // 要执行的代码}

示例：下面的 JavaScript 程序展示了一个 for 循环，变量 INLINECODE285399e0 从 1 运行到 3，每次 INLINECODEc7b91662 增加 1，并打印 "Count:" 以及当前 i 的值。

JavaScript


CODEBLOCK_dad0a42d


下图演示了 for 循环的流程图：

!Forloop

• 初始化条件：在这里，我们初始化要使用的变量。它标志着 for 循环的开始。我们可以使用已经声明过的变量，也可以声明一个仅限于该循环内部使用的局部变量。
• 测试条件： 它用于测试循环的退出条件。它必须返回一个布尔值。由于在执行循环语句之前会先检查条件，因此它也是一种“入口控制循环”。
• 语句执行：一旦条件评估为真，循环体内的语句就会被执行。
• 增量/减量：它用于更新变量，以便进行下一次迭代。
• 循环终止：当条件变为假时，循环就会终止，这也标志着其生命周期的结束。

1.1 for in 循环
for-in 循环 用于遍历对象的可枚举属性。
语法：

for (let key in object) {
    // 要执行的代码
}

示例：下面的 JavaScript 程序展示了 for-in 循环遍历 person 对象的键，并打印每个键及其对应的值。

JavaScript


CODEBLOCK_1d5710f1

1.2 forEach 循环

forEach 循环会对数组中的每个元素执行一次提供的函数。

语法：

array.forEach(function(element, index, array) {
  // 要执行的代码
});

示例：下面的 JavaScript 程序展示了 INLINECODE754ada25 循环对 INLINECODE9dff200a 数组中的每个元素执行一个函数，打印出每个数字。

JavaScript


CODEBLOCK_fdf59472


2. while 循环

while 循环 只要条件为真就会一直执行。我们可以把它看作是一个重复执行的 if 语句。
语法

while (condition) {
    // 要执行的代码
}

示例：下面的 JavaScript 程序展示了一个 while 循环，只要 INLINECODEf2b14581 小于 3，它就会反复打印 "Number:" 和 INLINECODE8eab25fa 的值，每次循环 i 增加 1。

JavaScript


CODEBLOCK_393faacb


下图演示了 while 循环的流程图：

!While-loop

• While 循环始于对布尔条件的检查。如果评估结果为真，则执行循环体语句，否则执行循环后的第一条语句。因此，它也被称为“入口控制循环”。
• 一旦条件评估为真，循环体内的语句就会被执行。通常，这些语句包含为下一次迭代更新正在处理的变量的值。
• 当条件变为假时，循环终止，标志着其生命周期的结束。

3. do-while 循环

do-while 循环 与 while 循环类似，不同之处在于它会在检查条件之前先执行一次代码块。
语法

do {
    // 要执行的代码
} while (condition);

示例：下面的 JavaScript 程序展示了一个 do-while 循环，它会打印 "Iteration:" 和 INLINECODEcac7b48a 的值，每次 INLINECODE151e4589 增加 1，并在 i 小于 3 时重复此过程。这确保了代码块至少会运行一次。

JavaScript


CODEBLOCK_8647df26


下图演示了 do-while 循环的流程图：

!Do-while-loop

• do while 循环始于对