forEach与for的性能对比,谁快谁慢?
发布于 10 年前 作者 zhiyishou 8639 次浏览 最后一次编辑是 8 年前 来自 问答

在对数组的遍历中,我在多处查到forEach差for的速度太大了,但是我自己试着测试时,结果却是相反的~

d0c8a786c9177f3e04e69edc72cf3bc79e3d5614.jpg

这是在 http://jsperf.com/fast-array-foreach 的在线运行结果,很明显能看出来forEach很慢

但是我在chrome控制台中再次运行时 1e30e924b899a9018f6236e71f950a7b0308f588.jpg

却得到了这样的结果,有点疑惑,希望大家能解释下

14 回复

图片无法查看

@JacksonTian 以前社区不能上传图片,加的外链挂了,现在已重新上图

经过再次测试,这与浏览器控制台的工作环境和模式有关。 在控制台下,for的工作时间变长,才造成了上面的误会。

for 要快很多

forEach 会创建一个新的作用域(匿名函数),主要开销在这里

var l = [];
for (var i = 0; i < 1000000; i++) {
    l.push(i);
}

var a = Date.now();
for (var i = 0, len = l.length; i < len; i++) {
    (function f(item) {}());
}
var b = Date.now();
console.log('for: ', b - a);

var a = Date.now();
l.forEach(function (item) {});
var b = Date.now();
console.log('forEach: ', b - a);

自己写的东西最可信

在浏览器中执行和在node中性能差异是否不同?

@chapgaga 不会的 如果你用Chrome应该差不多 毕竟同一个引擎

@zhiyishou 能说说为什么控制台的for会慢的具体原因吗? 我很像知道。

我自己也试过,结果毋庸置疑 for要比forEach要快很多,我想问下什么情况下用forEach比较好呢,有没有经典的例子什么的。

@tulayang 你试着把这段代码直接复制到控制台中运行,就会发现和这个帖子的差不多,但是为什么控制台下会出现这个?

@think2011 具体原因未知,在IE控制台中也是这样,只是上面代码for的循环的时间变为200~300ms,看来和浏览器中实现控制台各自的方法有关系

@zhiyishou

在firefox forEach快, chrome for快.

两个js解释器不一样的缘故.

查看 V8 源码 https://github.com/v8/v8/blob/master/src/js/array.js#L1037-L1055

function InnerArrayForEach(f, receiver, array, length) {
  if (!IS_CALLABLE(f)) throw %make_type_error(kCalledNonCallable, f);

  if (IS_UNDEFINED(receiver)) {
    for (var i = 0; i < length; i++) {
      if (i in array) {
        var element = array[i];
        f(element, i, array);
      }
    }
  } else {
    for (var i = 0; i < length; i++) {
      if (i in array) {
        var element = array[i];
        %_Call(f, receiver, element, i, array);
      }
    }
  }
}

每次调用都有 2 个判断,一个是参数是否为函数,另一个是元素是否为 undefined。

回到顶部