数组循环 属于

关于 数组循环

处理数组时，你可能想针对数组中的每个值执行一段代码。这叫做对数组进行迭代或循环。

这里讨论的是不需要在过程中修改数组的情况。如果要变换数组，请参见数组变换概念。

for 循环

遍历数组最基本、通常性能也最好的方式，是使用for循环，参见 for 循环概念。

const numbers = [6.0221515, 10, 23];

for (let i = 0; i < numbers.length; i++) {
  console.log(numbers[i]);
}
// => 6.0221515
// => 10
// => 23

for...of 循环

如果你想在每次迭代中直接使用值，完全不需要下标，就可以使用for...of循环。

for...of和上面那个基本for循环的工作方式一样，只是不需要在循环中把_下标_当作变量来处理，而是直接得到_值_。

const numbers = [6.0221515, 10, 23];

// Because re-assigning number inside the loop will be very
// confusing, disallowing that via const is preferable.
for (const number of numbers) {
  console.log(number);
}
// => 6.0221515
// => 10
// => 23

和普通的for循环一样，你可以用continue结束当前这次迭代，用break彻底结束循环的执行。

JavaScript 还有for...in循环，用来遍历对象中的键。要注意，for...of和for...in不能互换使用，详情请参见 MDN 文档。

forEach 方法

每个数组都有一个forEach方法，也可以用它来遍历数组中的元素。

forEach接受一个回调作为形参。对数组中的每个元素，回调函数都会被调用一次。

const numbers = [6.0221515, 10, 23];

numbers.forEach((number) => console.log(number));
// => 6.0221515
// => 10
// => 23

在上面的例子中，回调只把当前元素用作形参。如果需要，回调最多可以使用三个形参。

• 当前迭代的_值_
• 当前迭代的_下标_
• 整个_数组_

const numbers = [6.0221515, 10, 23];

function callback(number, index, fullArray) {
  console.log(number, index, fullArray);
}

numbers.forEach(callback);
// => 6.0221515 0 [ 6.0221515, 10, 23 ]
// => 10 1 [ 6.0221515, 10, 23 ]
// => 23 2 [ 6.0221515, 10, 23 ]

除了回调之外，forEach还接受一个可选的第二个形参，用来指定迭代时要使用的this上下文。你可以在 MDN 的“Using thisArg”一节中看到一个例子。

使用forEach时有几点需要注意。

• forEach循环一旦开始，就无法停止迭代。 break和continue语句在这里并不存在。
• 如果在循环开始后修改数组，forEach的行为会很奇怪。 追加到末尾的元素会被忽略，删除元素可能让其他元素被跳过，等等。 要避免这类问题，就不要在回调中修改底层数组。
• forEach方法本身的返回值是undefined。 因此，你无法在它后面继续链式调用其他数组方法。
• 如果你需要为性能优化代码，可以考虑改用for或for...of，因为两者的速度大约都是forEach的 3 倍。