javascript - 为什么 forEach 优于常规迭代器？

Question

我正在阅读 airbnb javascript guide .有一个特别的声明，说:

Don’t use iterators. Prefer JavaScript’s higher-order functions instead of loops like for-in or for-of.

他们给出上述说法的理由是:

This enforces our immutable rule. Dealing with pure functions that return values is easier to reason about than side effects.

我无法区分给定的两种编码实践:

    const numbers = [1, 2, 3, 4, 5];

    // bad
    let sum = 0;
    for (let num of numbers) {
     sum += num;
    }
    sum === 15;

    // good
    let sum = 0;
    numbers.forEach((num) => {
     sum += num;
    });

    sum === 15;

谁能解释一下，为什么 forEach 优于常规 for 循环？它如何真正发挥作用？使用常规 迭代器 有任何副作用吗？

Answer 1

Airbnb 风格指南中的这种推理适用于用于不变性的数组方法，它们是 filter、map、reduce 等。但不是forEach:

This enforces our immutable rule. Dealing with pure functions that return values is easier to reason about than side effects.

所以比较更像是:

// bad
let sum = 0;
for (let num of numbers) {
 sum += num;
}
sum === 15;

// bad
let sum = 0;
numbers.forEach((num) => {
 sum += num;
});

sum === 15;

// good
const sum = numbers.reduce((num, sum) => sum += num, 0);

sum === 15;

一般来说，for > forEach > for..of > for..in在性能上。这种关系在几乎所有引擎中都是统一的，但可能因不同的数组长度而异。

forEach 是在最新的 Chrome/V8 中得到显着改进的(几乎是两倍，基于 this 综合测试):

由于都是快速的，所以仅仅因为性能原因而选择不太合适的循环方法可以认为是初步优化，除非有其他证明。

与 for..of 相比，forEach 的主要优点是前者即使在 ES3 中也可以进行 polyfill，并提供值和索引，而后者则更多可读，但应在 ES5 及更低版本中进行转换。

forEach 有已知的缺陷，使其在某些情况下不适用，而这些情况可以使用 for 或 for..of 正确处理:

• 回调函数创建新上下文(可以用箭头函数寻址)

• 不支持迭代器

• 不支持生成器 yield 和 async..await

• 没有提供使用 break

  提前终止循环的正确方法