Javascript中的堆栈与堆？ （超出最大调用堆栈大小）

Question

我正在尝试构建一个网页，我需要在 JavaScript 中铲出大约 100MB 的数据。使用不同的浏览器时，我会在不同的数据量下遇到“超出最大调用堆栈大小”错误。

我是否可以通过检查我的代码并尝试将函数内的局部变量移动到更全局的范围以尝试将它们分配到堆而不是堆栈上来解决此问题？还是这些概念在 JavaScript 中不存在？ （据我所知，我的数据中没有任何主要的递归循环，所以确实是几个巨大的字符串/数字数组似乎导致了错误）

如果这不可能，有没有办法让浏览器保留更多内存？

Answer 1

好的，找到问题了。我的代码中确实没有递归。如果 JavaScript 函数是“可变参数”函数，例如 <array>.splice(...)，那么确实可以调用具有数百个参数的 JavaScript 函数。

旁白：GWT 使用 JavaScript 拼接函数以或多或少聪明的方式实现了 Java 函数 System.arraycopy(...)。

splice 接受任意数量的输入元素以插入到目标数组中。可以使用以下构造从另一个数组传递这些输入元素：

var arguments = [index, howmany].concat(elements);
Arrays.prototype.splice.apply(targetarray, arguments);

这相当于调用：

targetarray.splice(index, howmany, elements[0], elements[1], elements[2], ...);

如果 元素 变大（请参阅下文，了解“大”对于不同浏览器的含义），您可能会收到“超出最大调用堆栈大小”错误 没有递归，因为它的内容将被加载到函数调用的堆栈中。

这是一个演示此问题的简短脚本：

var elements = new Array();
for (i=0; i<126000; i++) elements[i] = 1;
try {
    var arguments = [0, 0].concat(elements);
    Array.prototype.splice.apply(elements, arguments);
    alert("OK");
} catch (err) {
    alert(err.message);
}

使用此脚本，“大”意味着以下内容：

• Chrome 19：元素包含约 125,000 个数字
• Safari 5.1（在 Windows 上）：元素包含约 65,000 个数字
• Firefox 12：元素包含约 500,000 个数字
• Opera 11.61：元素包含约 1,000,000 个数字

赢家是：Internet Explorer 8 带来了改变！在此函数调用失败之前，它可以耗尽所有系统内存。

附注：Firefox 和 Opera 实际上会抛出不同的（更有用的）错误消息：Function.prototype.apply: argArray is too large

Answer 2

在 Javascript 中没有将内存分成堆栈/堆。您看到的可能是以下之一：

1. 递归运行太深。在这种情况下，您需要检查您的算法，使其更具迭代性并使用更少的递归，这样您就不会遇到浏览器施加的调用堆栈限制。
2. 如果您的算法没有深度递归，考虑到您的代码已生成，这可能仍然只是一个足够深的调用。
3. 最后，一些引擎可能会在某种内部堆栈上分配函数参数和作用域命名变量，以便快速查找。如果您（或自动生成的代码）碰巧在函数中使用了数千个局部变量或参数，这也可能会超出引擎特定的限制。