JavaScript - 配列の操作と速度(for loopとforEach、map)

Python - 関数(リスト内包表記)のJavaScriptの場合の配列の操作に使った、for loop、map、forEachの3つがどう違うのか少し気になったので、とりあえず単純な操作の速度を計測して比較してみることに。

することは、整数0から指定した整数(読み込み時は10万)までの配列の各要素を2倍して、それぞれの方法でそれぞれの空の配列にpushしていく。

コード(BBEdit)

var a = [],
    b = [],
    c = [],
    d = [],
    n = parseInt($('#t0').val(), 10),
    result = "",
    start, t, i, max;
for (i = 0, max = n; i < max; i += 1) {
    a[i] = i;
}
start = new Date().getTime();
for (i = 0, max = a.length; i < max; i += 1) {
    b.push(2 * a[i]);
}
t = new Date().getTime() - start;
result += "for loop: " + (t / 1000) + "秒\n";
start = new Date().getTime();
a.forEach(function ( x ) {
    c.push(2 * x);
});
t = new Date().getTime() - start;
result += "forEach: " + (t / 1000) + "秒\n";
start = new Date().getTime();
d = a.map(function ( x ) {
    return 2 * x;
});
t = new Date().getTime() - start;
result += "map: " + (t / 1000) + "秒\n";
$('#pre0').text(result);

配列の要素数:

以下の結果は現在使用中のブラウザ(userAgent: )の10万回のときの場合。

10万回の時の結果はFirefox、Google Chrome(すべてMac版)は予想してた通りfor loopが一番速かった。Safariは似たり寄ったりでとりあえず10万回ではあまり差が出なかった。eval(の場合は100万個で試してみた)のときも同様になると思ったら、Firefoxの場合は変わらずにforループが1位、Safariはmapが1位になった。そしてGoogle ChromeはforEachもmapも似たような数字だったけど、forループがすごく遅くなった。なんでだろう。。(あとIE/WindowsとかiOSとか他の環境の場合も気になったり。)

とりあえず単純なこと、簡単な事をするときは今まで通りforループを使えば問題無さそうだけど、for loopとforEachとかmapはどういう時に使い分けたら便利だったり、効果的だったりするのかな〜