配列リテラルの使用 | 配列の定義 | JavaScript 超完全入門基本から発展までのすべて

INDEX

配列リテラルとは？

JavaScriptで配列を作成する最も一般的な方法が、配列リテラルを使用する方法です。

配列リテラルとは、角括弧[]の中に要素をカンマ区切りで並べて記述する構文です。シンプルに配列を作成できるため、現在では最もよく利用される書き方となっています。

const fruits = ["apple", "banana", "cherry"];

console.log(fruits);
console.log(fruits[0]);

実行結果

["apple", "banana", "cherry"]
apple

この例では、配列fruitsを配列リテラルで作成しています。

配列にはlengthプロパティがあり、現在の要素数を取得できます。

const fruits = ["apple", "banana", "cherry"];

console.log(fruits.length);

実行結果

要素数は動的に変化するため、ループ処理などでも頻繁に利用されます。

配列リテラルで作成した配列は、要素の追加・変更・削除などさまざまな操作ができます。

const fruits = ["apple", "banana", "cherry"];

// 配列の末尾へ追加
fruits.push("orange");

console.log(fruits);

実行結果

["apple", "banana", "cherry", "orange"]

push()は配列の最後に要素を追加する代表的なメソッドです。

const fruits = ["apple", "banana", "cherry"];

fruits[1] = "grape";

console.log(fruits);

実行結果

["apple", "grape", "cherry"]

インデックスを指定することで、特定の要素を簡単に変更できます。

JavaScriptの配列には、同じ型だけではなく、異なるデータ型も自由に格納できます。

const mixedArray = [
    "apple",
    42,
    true,
    { name: "banana" },
    ["orange", "grape"]
];

console.log(mixedArray);

実行結果

["apple", 42, true, { name: "banana" }, ["orange", "grape"]]

このように、文字列・数値・真偽値・オブジェクト・配列などを同じ配列へ格納できます。

あとから要素を追加する場合は、空の配列を作成しておくこともよくあります。

const fruits = [];

fruits.push("apple");
fruits.push("banana");

console.log(fruits);

実行結果

["apple", "banana"]

配列はArrayコンストラクターでも作成できますが、現在では配列リテラルを使用する方法が一般的です。

const array1 = ["apple", "banana"];

const array2 = new Array("apple", "banana");

どちらも同じ配列を作成できますが、配列リテラルのほうが短く読みやすいため、多くの場面で推奨されています。

配列の操作方法によって、処理速度に違いが生じる場合があります。

通常の開発では性能を過度に気にする必要はありませんが、大量のデータを扱う場合は適切なメソッドを選択すると効率的です。