【Javascript】new Array()で配列を定義する時は最大数に注意

javascript

先日、とある案件で他のベンダさんが書いたプログラムを検証する機会がありました。

そのお客さんによると、最初は動いていたが、ある日突然動かなくなったとのこと。

調べてみると、Chromeでどうも以下のようなエラーが出ています。

Uncaught RangeError: Maximum call stack size exceeded

なんだ?と思って当該行を見てみると以下のようになっていました(ちなみに今回はjavascriptです)。

var data = new Array(
    '100',
    '200',
    ・・・   // 以降何万行と続く
);

for(var i = 0; i < data.length; i++){ // ←data.lengthを参照すると怒られる
    // 処理
}

へーと思って、とりあえず配列の要素数を減らしていくと、ちょうど41,912個のところでエラーが発生することがわかりました(chromeの場合)。

なので、chromeの場合、new Array()で配列を初期化する際、最大要素数は41,911個らしいことが分かりました。

解決方法

解決方法は色々あると思いますが、最も簡単なのはnew Arrayを使わない事です。

代わりに[]を使えばいいと思います。

念のために書いておくとこんな感じ。

var data = [
    '100',
    '200',
    ・・・   // 以降何万行と続く
];

タイプ数も[]だけの方が少なくてラクです。

[]に要素数の制限はないの?

調べてみたのですが、はっきりとは分かりませんでした。

javascriptの言語使用としては、4,294,967,295個(約42億)らしいんですが、実機で試すのは断念しました(120万くらいまでは確認できましたが、、、)。

42億あれば、通常の使い方をする分には問題ないでしょう。

Chrome 以外では?

さて、話をnew Array() の方に戻すと、こちらの最大要素数はブラウザによって差異があるようです。

上でも「Chromeでは」と断っていたのはこのためです。

参考までに、EdgeとInternet Explorerでも最大要素数を調べてみました。

Chrome41,912
Edge※41,918
IE1165,530
各ブラウザにおけるnew Array()で初期化できる最大要素数

※Edgeのバージョンは83。Chromeに飲み込まれた後です。

手元にFirefoxがなかったので、暇な人は調べてみて下さい。

まとめ

今まで、new Array()も[]も同じだろうと思っていましたが、違うんですね、、、

今回の件では、ツールで上記のようなjavascriptのソースコードを吐き出していたのですが、最初は要素数が少なかったので正常に動いていたようです。

それが、長年使用するにあたってデータが増え、ついに42,000個くらいになって動かなくなった、と。

今までnew Array()という書き方はあまり見たことがなかったのですが、改めて、今後javascriptで配列を初期化する時は必ず[]を使おうと心に誓いました。

コメント

タイトルとURLをコピーしました