Edited at

es5のforEachって高速なの?

More than 3 years have passed since last update.

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


forEach

28.434

20.039

39.702

20.401

27.185

avg 27.1522ms


_.each

_.each

25.686

18.825

22.195

20.494

18.763

avg 21.1926ms


for

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)});

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