2

做了一个观察——吸引不存在的数组元素，大大降低了性能。它在长循环上很明显。为什么会发生？

例子：

var filledArray = []; //This array will filled
var emptyArray = [];  //This array leave empty

//fill one array
for(var i = 0; i < 1e6; i++) {
    filledArray[i] = true;
}

//Just iterate the array and call its elements
//In filled array all elements exists, in empty array non-exists
function callItems(arr) {
    for(var i = 0; i < 1e6; i++) {
        arr[i];
    }
}

//measurement function
function bench(f, d) {
    var start = new Date;
    f(d);
    alert(new Date - start, ' ms');
}

////Result for filled array
//Firefox 24.0:             20 ms
//Chrome 30.0:              3  ms
bench(callItems, filledArray);

////Result for empty array
//Firefox 24.0:             340 ms
//Chrome 30.0:              70  ms
bench(callItems, emptyArray);

编辑：
如果您在 Firefox 中运行代码，请注意导致 Firefox 影响 Firebug - 启用或禁用它。经过各种测试，我明白了。
如果它启用 - 结果相同，我在上面写的。但是，如果在启动 Firefox 后未启用 Firebug - 时间等于 2ms（比 Opera 和 Chrome 快）并且空/填充数组之间的差异消失了。
还会影响结果交换调用函数 bench() - 首先是空数组，然后是填充数组（仅在启用 Firebug 的 Firefox 中，没有 Firebug 和其他浏览器结果不变）。

为什么这样会影响 Firebug？– 附加问题。

4

1 回答 1

3

这很可能是因为 JavaScript 引擎正在0通过i空数组为元素分配空间。当数组被填充时，JS 引擎简单地访问元素并返回它的值。在空的情况下，引擎准备在数组中的那个位置设置一个值，这需要为那个元素分配空间。

在任务管理器打开的情况下在 Chrome 30 中运行您的示例代码，我观察到在第二步（遍历空数组）期间页面的内存使用量激增 10k。当引擎意识到这个空间没有被使用时，这个空间很快就被释放了。

于 2013-10-24T01:17:44.463 回答