javascript - 为什么 for-of 循​​环对于小数组比标准 for 循环更快而对于更大数组更慢？

Question

在 JavaScript 中，我注意到 ES6 for ... of 循环的性能与传统的 for (start; stop; step) 循环有很大不同。

基准

const n = 10000;
const arr = Array(n).fill().map((e, i) => i); // [0, n)

console.log('n =', n);

let sum1 = 0;
console.time('for let i');
for (let i = 0; i < arr.length; i++) {
  sum1 += arr[i];
}
console.timeEnd('for let i');

let sum2 = 0;
console.time('for of');
for (let v of arr) {
  sum2 += v;
}
console.timeEnd('for of');

结果

n = 10
for let i: 0.350ms
for of: 0.015ms
-----
n = 100
for let i: 0.354ms
for of: 0.023ms
-----
n = 1000
for let i: 0.429ms
for of: 0.111ms
-----
n = 10000
for let i: 1.048ms
for of: 2.138ms
-----
n = 100000
for let i: 9.452ms
for of: 13.644ms

(使用 Node.js v10.11.0 测试)

如您所见，随着 n 的增加，for-of 循​​环的速度下降速度比标准 for 循环更快。为什么 for-of 循​​环对于较小的数组更快而对于较大的数组更慢？

Answer 1

当对较小的值进行基准测试时，开销操作会对测试产生更大的影响。

例如，如果变量初始化和内存分配需要 0.1 毫秒，这在 n > 1000 时可以忽略不计，但是在 n = 10 时很重要。

在这种情况下，for/of 运算符允许 V8 引擎优化循环操作(减少上述开销)。例如，它可以将数组项预加载到堆栈或类似的地方。

for/let 操作将独立于整个数组处理每个项目，并且在变量使用方面更加明确(减少引擎可以进行的优化量)。