用 JavaScript 循环：鞭辟入里的指南

2023-11-13 15:11:36

掌握 JavaScript 循环是编程技能必不可少的组成部分。在本文中，我们将深入探讨各种循环类型及其微妙之处，为您提供全面而实用的指南。

遍历的魅力

循环的精髓在于重复执行代码块。它使我们能够有效地遍历数据结构（如数组和对象），并根据需要对每个元素进行操作。JavaScript 提供了多种循环类型，每种类型都针对特定的用途而量身定制。

for 循环：可靠的多面手

for 循环是循环遍历数组或对象的经典方式。其语法如下：

for (let i = 0; i < array.length; i++) {
  // 操作数组元素
}

您可以通过设置 i 的初始值、结束条件和增量值来定制循环。

while 循环：等待条件

while 循环在满足特定条件时执行代码块。其语法为：

while (condition) {
  // 操作代码
}

condition 可以是任何布尔表达式，只要它为 true，循环就会继续执行。

do-while 循环：至少执行一次

do-while 循环与 while 循环类似，但它至少执行代码块一次，即使条件为 false。其语法为：

do {
  // 操作代码
} while (condition);

for-of 循环：更简洁的遍历

for-of 循环提供了一种更简洁的方式来遍历可迭代对象（如数组或字符串）。其语法为：

for (const element of array) {
  // 操作元素
}

for-in 循环：深入对象属性

for-in 循环用于遍历对象的属性。其语法为：

for (const property in object) {
  // 操作属性
}

请注意，for-in 循环还遍历对象的继承属性，这在某些情况下可能是意外的。

控制循环流

有时，您需要控制循环流。JavaScript 提供了以下

break： 立即退出循环。
continue： 跳过当前迭代，继续下一迭代。
return： 立即退出循环并返回一个值。

使用实例

以下是一个使用不同循环类型遍历数组的示例：

// 使用 for 循环
const array = [1, 2, 3, 4, 5];
for (let i = 0; i < array.length; i++) {
  console.log(array[i]);
}

// 使用 while 循环
let i = 0;
while (i < array.length) {
  console.log(array[i]);
  i++;
}

// 使用 do-while 循环
i = 0;
do {
  console.log(array[i]);
  i++;
} while (i < array.length);

// 使用 for-of 循环
for (const element of array) {
  console.log(element);
}