new Array()と[]の違い

  • 179
    いいね
  • 0
    コメント
この記事は最終更新日から1年以上が経過しています。

JavaScriptで配列を生成するにはコンストラクタ new Array() とリテラル [] の二つがあるので違いをまとめておく。
個人的には、簡潔で読みやすいので、なるべく [] を使うべきだと思っている。

機能面での違い

どちらも配列オブジェクトを生成する。
ただし、整数を一つだけ渡した際の挙動が異なる。

  • new Array(3) はlengthが3の配列を生成する。中身は0から2まですべてundefinedになっている。
  • [3] は要素をひとつだけ含む配列を生成する。
基本的な使い方
console.log( new Array(1,2,3) ); //1,2,3
console.log( [1,2,3]          ); //1,2,3

console.log( new Array(3) ); //undefined, undefined, undefined
console.log( [3]          ); //3

逆に言えば、

  • new Array()は[3]のように整数一つだけを含む配列を作成できない
  • []はサイズを指定して配列を作成できない

ということになる。

速度面での違い…はほとんどない

先に結論を書いてしまった。エンジンにもよるし使い方にもよる。どちらが速いというものでもないので、読みやすさを優先すればよい。

完璧主義者のために、差が出るポイントをまとめてみる。

参照解決のコスト

「Array」は予約語ではないので、ローカル変数を指している可能性がある。JavaScriptエンジンからすれば、「Array」が組み込みオブジェクトのArrayであることを特定する作業が必要になるのだ。わずかだがここにコストがかかる。
これに対してリテラルは変数ではないので参照解決の必要がない。

このため、理論上は[]の方が速い。
ただ、実際に測定してみるとほとんど差が感じられない。with()を10段重ねるとか、わざとらしいコードを書けば影響がわかるが、普通そんなことはしない。JavaScriptエンジンの最適化がよく効いているのだと思う。
むしろ次の配列長の方が影響が大きい。

配列長の変更コスト

配列の長さを変更するのにも少しコストがかかる。
このため、[]で作った配列を埋めていくより、最初から必要な配列長を指定して確保しておくと、速くなることがあった。(過去形です)

var arr = [];
for (var i=0; i<1000; i++) {
  arr[i] = i;
}
//古いブラウザでは↓の方が速い
var arr = new Array(1000);
for (var i=0; i<1000; i++) {
  arr[i] = i;
}

一つずつ要素を入れて配列長をじわじわ伸ばしていくより、最初にまとめて確保しておいた方が軽いという理屈だ。
古いJavaScriptエンジンでは有効なテクニックだったのだが、エンジンの進歩により、逆転現象が起きている。V8で測定すると[]を使った方が2倍ほど速かった。

というわけで、今の時代、タイプ数の多い new Array をあえて使う必要はない。