JavaScript
Node.js

【追記:2018 01/25】配列の連結(concat vs Array.prototype.push.apply)

More than 1 year has passed since last update.


追記

こちらに追記しようとしたのですが見にくかったので別記事にしました

ES6での配列の連結方法になります

https://qiita.com/kaz2ngt/items/c03625587bf398b6f81a


以下過去記事


投稿テストも兼ねたメモ


配列の連結

一般的に配列の連結はconcatを用いるが、配列に配列を継ぎ足していくような処理だとconcatでは毎回配列を生成しているのがきになり、他の手段を調べてみるとArray.prototype.push.applyというものがあったためメモ


実行ファイル


test1.js

var a = [0, 1, 2, 3], b = [4, 5, 6, 7], i, count = 10000;

console.time();
for (i = 0; i < count; i++) {
a = a.concat(b);
}
console.timeEnd();


test2.js

var a = [0, 1, 2, 3], b = [4, 5, 6, 7], i, count = 10000;

console.time();
for (i = 0; i < count; i++) {
Array.prototype.push.apply(a, b);
}
console.timeEnd();


方法

上記のファイルをそれぞれ5回ずつ実行して計測しました。(node v0.10.18)


結果

1回目
2回目
3回目
4回目
5回目

concat
200ms
200ms
201ms
202ms
201ms

Array.prototype.push.apply
3ms
3ms
2ms
2ms
3ms


結論

大量に配列を連続して連結する必要がある場合にはとても有効かと思います。

しかし、http://www.kanasansoft.com/weblab/2009/04/javascriptconcat.html のブログにもあるように、

単純に1回だけなどではconcatの方が早かったりするため、上記のような条件以外では検証が必要です。


補足


配列の連結が1回だけの場合


test3.js

var i, count = 100000;

console.time();
for (i = 0; i < count; i++) {
var a = [0, 1, 2, 3], b = [4, 5, 6, 7];
a = a.concat(b);
}
console.timeEnd();


test4.js

var i, count = 100000;

console.time();
for (i = 0; i < count; i++) {
var a = [0, 1, 2, 3], b = [4, 5, 6, 7];
Array.prototype.push.apply(a, b);
}
console.timeEnd();


結果

1回目
2回目
3回目
4回目
5回目

concat
10ms
9ms
10ms
10ms
9ms

Array.prototype.push.apply
15ms
16ms
15ms
15ms
15ms