配列を作成する

広告

配列を新しく作成する方法について解説します。 JavaScript では配列リテラルを使って配列を作成する方法と、 Array オブジェクトのコンストラクタを使って作成する方法があります。

配列リテラルから配列を作成する

配列リテラルを使って配列を生成する場合は次の書式を使用します。

[要素1, 要素2, 要素3, ...]

配列の要素をカンマ(,)で区切って記述し、全体を [] で囲います。要素には配列に格納する値を記述します。例えば次のように記述します。

let result = [78, 69, 84, 50];
let fruit = ['apple', 'lemon'];

JavaScript の配列では、任意のデータ型の値を配列に格納できます。またそれぞれの要素に異なるデータ型の値を格納することもできます。

let profile = ['Yamada', 24, 'Tokyo', true];

JavaScript の配列では一度作成した配列にあとから要素を追加したり削除したりすることができます。そこでとりあえず要素が空の配列を作成することもできます。空の配列は次のように記述します。

let data = [];

console.log(data);
>> []

また JavaScript の配列では例えば要素が連続している必要はありません。例えば 1 番目と 3 番目の要素はあるが 2 番目の要素が存在しない配列を作成するには次のように記述します。存在しない要素の値を取得すると undefined が返されます。

let data = [84, , 76];

console.log(data);
>> [84, empty, 76]

console.log(data[1]);
>> undefined

値が代入されていないのではなく要素そのものが存在しない点にご注意ください。

※ 配列の length プロパティは一番最後のインデックスに 1 を加えた値を返します。 インデックス 0 の要素から最後のインデックスの要素まですべて要素がある場合は length プロパティを使って要素数を調べることができますが、 JavaScript の配列では途中の要素が存在しない場合があるので length プロパティ + 1 が必ずしも要素数とはなりません。

要素の値として式を指定する

配列を作成する時に要素の値として数値や文字列などのリテラルだけではなく式を指定することができます。

次のサンプルでは配列を作成する時の値として変数を記述しています。この場合、変数に格納されている値が要素の値として使用されます。

let num = 10;
let data = [45, num];

console.log(data);
>> [45, 10]

次のサンプルでは配列を作成する時の値として計算式を指定しています。この場合、計算式の結果が要素の値として使用されます。

let num = 10;
let data = [num + 5, num * num];

console.log(data);
>> [15, 100]

このように配列の要素には数値や文字列などのリテラルだけでなく、式を記述することができます。

Arrayオブジェクトから配列を作成する

Arraya オブジェクトは JavaScript で用意されている組み込みオブジェクトのひとつで配列を扱うためのオブジェクトです。配列の作成には先ほど解説した配列リテラルを使って作成することもできますが、 Array オブジェクトのコンストラクタを使って作成することもできます。書式は次の通りです。

new Array(要素1, 要素2, 要素3, ...)

例えば次の 2 つの文は同じ配列を作成しています。

let fruit1 = ['apple', 'lemon'];
let fruit2 = new Array('apple', 'lemon');

また作成する要素数だけを指定して配列を作成することもできます。書式は次の通りです。

new Array(要素数)

例えば次のサンプルでは要素数が 5 の空の配列を作成します。

let data = new Array(5);

console.log(data);
>> [empty, empty, empty, empty, empty]

一つ注意点として、要素が 1 つで値が数値の配列を Array オブジェクトのコンストラクタを使って作成しようとした場合、要素数を指定して作成した場合と同じ記述になってしまいます。

let data1 = new Array(5);  // 要素数が 1 つで値が 5 の配列
let data2 = new Array(5);  // 要素数が 5 つで空の配列

この場合、要素数が 5 で空の配列が作成されます。このように Array クラスのコンストラクタを使って配列を作ろうとすると意図しない結果となってしまう場合がありますので、配列を作成するときは配列リテラルを使用して作成してください。

-- --

配列を新しく作成する方法について解説しました。

( Written by Tatsuo Ikura )

関連記事 (一部広告含む)
Profile
profile_img

著者 / TATSUO IKURA

初心者~中級者の方を対象としたプログラミング方法や開発環境の構築の解説を行うサイトの運営を行っています。