この記事には広告を含む場合があります。
記事内で紹介する商品を購入することで、当サイトに売り上げの一部が還元されることがあります。
目次
javascriptにて配列の初期化する方法
javascriptで配列を初期化して生成する方法は多数あります。
そこで今回はよく利用される汎用的な初期化の書き方と、ES6以上の書き方をまとめていきます。
共通の配列の初期化方法
まずは基本的な書き方から記述します。融通が利かない上に便利な機能がないですが、ほとんどのブラウザーで対応できる書き方のため、まだ主流の書き方になります。
本記事のサンプルプログラムの出力結果は、chromeのコンソールのキャプチャー画像を掲載しています。
Arrayを使用して初期化した配列を作成する
javascriptにて恐らく一番古い書き方です。次に記述するカッコ[]を利用する方が増えてますが、ライブラリ等ではよく見かける書き方です。
サンプルプログラム
|
1 2 3 4 5 6 7 8 |
<html> <body> <script> var arr = new Array(0, 0, 0, 0, 0, 0); console.log(arr); //出力結果： [0, 0, 0, 0, 0, 0] </script> </body> </html> |
サンプルプログラムの出力結果
カッコ[]を使用して初期化した配列を作成する
私的には「一番主流かな？」と感じている書き方です。PHPなどのウェブ開発で利用される言語でも同記述することが多いです。
サンプルプログラム
|
1 2 3 4 5 6 7 8 |
<html> <body> <script> var arr = [5, 11, -34, 79, 8, 62]; console.log(arr); //出力結果： [5, 11, -34, 79, 8, 62] </script> </body> </html> |
サンプルプログラムの出力結果
ES6以上の配列の初期化方法
任意の値(例：0)で配列を初期化する
サンプルプログラム
|
1 2 3 4 5 6 7 8 |
<html> <body> <script> var arr = Array(8).fill(0); console.log(arr); //出力結果：[0, 0, 0, 0, 0, 0, 0, 0] </script> </body> </html> |
サンプルプログラムの出力結果
ちなみに[初期化したい値]を5にしたときは、5で初期化した配列が生成されます。
0,1,2…任意の値までの配列を初期化する
公差+1の等差数列で配列を初期化します。
サンプルプログラム
|
1 2 3 4 5 6 7 8 |
<html> <body> <script> var arr = Array.from(Array(6).keys()); console.log(arr); //出力結果： [0, 1, 2, 3, 4, 5] </script> </body> </html> |
サンプルプログラムの出力結果
ランダムの値(整数)で配列を初期化する
サンプルプログラムは「1～100」までのランダムな値で配列を初期化します。
Math.random()関数は、[0, 1)（0以上、1未満）の浮動小数点を返すため、最大値を含む値を得たいときは「+1」するのがポイントになります。
|
1 2 3 4 5 6 7 8 |
<html> <body> <script> var arr = Array(3).fill().map(v => Math.floor( Math.random() * (100 + 1) )); console.log(arr); //出力結果(例)： [79, 78, 19] </script> </body> </html> |
ランダムの値(小数)で配列を初期化する
サンプルプログラムは「0以上、1未満」の浮動小数点のランダムな値で配列を初期化します。
サンプルプログラム
|
1 2 3 4 5 6 7 8 |
<html> <body> <script> var arr = Array(3).fill().map(v => Math.random()); console.log(arr); //出力結果(例)： [0.7849631568026749, 0.3542716213381272, 0.7143456786549487] </script> </body> </html> |
サンプルプログラムの出力結果
さいごに
現実問題として、まだIEを切り捨てる訳にはいかないのでjavascriptのES6版を使う機会は、もう少し先になると考えています。ただとても便利な機能が実装されているため、OSのバージョンアップに伴い、ユーザーのブラウザー環境が整うのを心待ちにしています。
