Question

我已经阅读了几个有关此主题的问题/文章，并且在我的解决方案中测试了使用for的相同代码块大多数时间比each快。

然而，我的问题与事实有关，而在我的页面中我有大约30个“循环”，使用each的起始结果大约为5300毫秒（平均值），最大值为5900毫秒，最小值为4800毫秒。

在我将它们更改为for并且最终结果出乎意料地变慢之后，花费更多时间作为之前的平均值（并且从未低于4800ms并且甚至高于6000ms）.....但是当我在每个“循环块”中放置console.time('Time') console.timeEnd('Time')时，我得到了预期的结果（FOR更快）。

使用for而不是each的全球“时间”是如何缩短的？

可以请你指出一些可能的原因吗？

P.S .- 完整的源代码非常庞大，这里的重要部分是唯一的变化是：循环each转换为for。

用于For循环的样本

var l = list.length;  
for (var i=0;i<l; i++) {  

}

用于每个循环的样本

$.each(list, function (i, item) {

});

更新＃1

使用console.time('Time')衡量时间 console.timeEnd('Time')。在全球时间我只使用一个“计数器”。对于多个计数器，我当然使用不同的名称。
在所有这个“进程”中，没有Ajax请求，因此不同的时间与此无关。

更新＃2

正如@epascarello所要求的那样：每个循环的“内部代码”从未改变过，它不应该是原因，当我们以相同的方式访问这些对象时更是如此（使用For或Each ）list[i].SomeProperty，imho时间差异永远不会归咎于内部代码（我认为）。

更新＃3

有时我使用级联“循环”使用不同的变量i，ii，iii。
我经常在同一个函数中“重用”变量：

var l = list1.length; ...; l = list2.length;

这同样适用于for变量i，ii，iii。

更新＃4

我注意到Chrome中存在一种奇怪的行为：以下模式用于重复多次，停止一段时间然后再次出现。

DrawGUI：6159.000ms 再次
DrawGUI：5990.000ms 下降
DrawGUI：5804.000ms 下降
DrawGUI：5416.000ms 下降
DrawGUI：5315.000ms 下降
DrawGUI：5311.000ms 下降
DrawGUI：5325.000ms
DrawGUI：5248.000ms 下降
DrawGUI：5010.000ms 下降
DrawGUI：4886.000ms 下降
DrawGUI：5645.000ms *再来一次*
DrawGUI：5247.000ms
DrawGUI：5446.000ms

在所有这些测试中，我关闭了所有其他chrome选项卡和不必要的应用程序。尝试最小化不稳定的CPU可用性。

Answer 1

由于您正在对空循环进行基准测试，因此您可以为JIT（即时编译器）提供足够的优化空间。可能是each调用一起被删除，因为它没有副作用。然而，for循环必须运行，因为i在范围中定义，包含 for循环，而不是在for循环内。

(function() {
    for (var i=0; i<10; i++) {}
    console.log(i); // outputs 10
})();

VS

(function() {
    [0,1,2,3,4,5,6,7,8,9].forEach(function(i) {});
    console.log(i); // i is not declared
})();

这也是为什么JSLint / JSHint抱怨i被声明为以下代码两次的原因：

for (var i=0; i<10; i++) {}
for (var i=0; i<10; i++) {}

Javascript For循环VS JQuery每个：奇怪的结果

可以请你指出一些可能的原因吗？

1 个答案: