More than 5 years have passed since last update.

es5のforEachって高速なの？

Last updated at 2015-05-27Posted at 2015-05-08

es5でいろいろ関数追加されたので、underscoreとかjqueryよりもこっちを使ったほうが高速なのかなとかれこれ一年ぐらいもやもやしていたので調べてみた。

検証してみた

  var array = [];
  var i = 0;

  for (i;i<100000;i++){
    array.push("hoge"+i);
  }

forEach

  console.time("forEach");
  array.forEach(function(item){
    item = item + "aaa";
  });
  console.timeEnd("forEach");

_.each

  console.time("_each");
  _.each(array,function(item){
    item = item + "ccc";
  });
  console.timeEnd("_each");

for

  console.time("for");
  for (i;i<100000;i++){
    array[i] = array[i] + "bbb";
  }
  console.timeEnd("for")

Chrome 42.0.2311.135 (64-bit)
CPU 2.7 GHz Intel Core i5
OS Mac OS X 10.10.2

28.434
20.039
39.702
20.401
27.185

avg 27.1522ms

_.each
25.686
18.825
22.195
20.494
18.763

avg 21.1926ms

0.007
0.008
0.008
0.01
0.008

avg 0.0082

forEachけっこう遅いですね。
underscoreのeachのほうがまだちょっと速いぐらい。

クロージャつくらないforがダントツで高速でした。
予想はしていましたがダントツすぎてびびりました。

コメントで教えてもらいましたが
forEachが_.eachより遅いのはdeleteされた配列はスキップしてくれるからです。

_.eachやforの場合、中身があろうがなかろうが、
indexを参照します。

var arr = [1,2,3,4];
delete arr[2];

//1,2,4が出力
arr.forEach(function(v){console.log(v)});

用途に応じて使い分けるのがよさそうですね。