javascript - 高级 JavaScript 数组串联 - 性能

Question

我正在尝试两种不同的方式来连接两个数组并使用巨大的数组来判断它们的性能，但我在第二个选项上遇到错误，我不明白为什么。

我首先用 10,000,000 个元素填充了它们的索引值。

var arr1 = [];
var arr2 = [];
for (var i = 0; i < 10000000; i++) {
    arr1[i] = i;
} 
for (var i = 0; i < 10000000; i++) {
    arr2[i] = i;
}

然后:

选项 1 在 ~520 毫秒内完成:

var newArr = arr1.concat(arr2);

---

虽然选项 2 会引发以下错误:

Array.prototype.push.apply(arr1, arr2);

错误:

/private/var/folders/j6/3fs5_k3n17z_0j2xrwj6sphw0000gn/T/CodeRunner/Untitled 9.js:12
Array.prototype.push.apply(arr1, arr2);
                     ^

RangeError: Maximum call stack size exceeded
    at Object.<anonymous> (/private/var/folders/j6/3fs5_k3n17z_0j2xrwj6sphw0000gn/T/CodeRunner/Untitled 9.js:12:22)
    at Module._compile (module.js:435:26)
    at Object.Module._extensions..js (module.js:442:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:311:12)
    at Function.Module.runMain (module.js:467:10)
    at startup (node.js:136:18)
    at node.js:963:3

编辑

根据其中一条评论，我将选项 2 更改为:

setTimeout(function () {
    Array.prototype.push.apply(arr1, arr2);
}, 0);

我还在:

/private/var/folders/j6/3fs5_k3n17z_0j2xrwj6sphw0000gn/T/CodeRunner/Untitled 9.js:16
    Array.prototype.push.apply(arr1, arr2);
                         ^

RangeError: Maximum call stack size exceeded
    at null._onTimeout (/private/var/folders/j6/3fs5_k3n17z_0j2xrwj6sphw0000gn/T/CodeRunner/Untitled 9.js:16:23)
    at Timer.listOnTimeout (timers.js:92:15)

Answer 1

apply() 方法将提供的数组展开为参数列表。 ECMAScript 规范本身对函数的参数数量没有限制，但大多数 JS 引擎都有特定于实现的限制，因为它们出于性能目的在其内部堆栈上为每个函数调用使用固定或有限大小的结构。虽然这个限制通常很高，但肯定远低于 10000000 个参数，这就是为什么您会收到错误“超出最大调用堆栈大小”的原因。