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

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

基准

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');

Results

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 循​​环对于较小的数组更快，而对于较大的数组更慢？

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

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

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

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