JavaScript 配列の const 宣言

1. ECMAScript 2015 (ES6)

2015年、JavaScript に重要な新しいキーワードである const が導入されました。
現在では、配列を宣言する際に const を使用することが一般的なプラクティス（慣習）となっています。

const cars = ["サーブ", "ボルボ", "BMW"];

2. 再代入の禁止 (Cannot be Reassigned)

const で宣言された配列は、別の配列を再代入することができません。

const cars = ["サーブ", "ボルボ", "BMW"];
cars = ["トヨタ", "ボルボ", "アウディ"];    // エラー（ERROR）になります

3. 配列そのものが定数なわけではない

const というキーワードは、少し誤解を招きやすい表現です。
これは「定数配列」を定義するのではなく、**配列への定数リファレンス（参照）**を定義するものです。

このため、定数として宣言された配列であっても、その要素（エレメント）自体を変更することは可能です。

3.1 要素の変更は可能 (Elements Can be Reassigned)

定数配列の要素を変更したり、新しい要素を追加したりすることができます。

// 定数配列を作成します
const cars = ["サーブ", "ボルボ", "BMW"];

// 要素を変更します
cars[0] = "トヨタ";

// 要素を追加します
cars.push("アウディ");

4. 宣言時の初期化 (Assigned when Declared)

JavaScript の const 変数は、宣言と同時に値を代入（初期化）する必要があります。
つまり、const で宣言された配列は、宣言時に必ず初期化されなければならないという意味です。

配列を初期化せずに const を使用すると、構文エラー（Syntax Error）が発生します。

例（動作しないケース）

const cars;
cars = ["サーブ", "ボルボ", "BMW"];

一方で、var で宣言された配列はいつでも初期化が可能です。
また、宣言される前にその配列を使用することさえ可能です（ホイスティング）。

例（動作するケース）

cars = ["サーブ", "ボルボ", "BMW"];
var cars;

5. const のブロックスコープ (Const Block Scope)

const で宣言された配列は、ブロックスコープ（Block Scope）を持ちます。
ブロック内で宣言された配列は、ブロックの外で宣言された配列とは別のものとして扱われます。

const cars = ["サーブ", "ボルボ", "BMW"];
// ここで cars[0] は "サーブ" です

{
  const cars = ["トヨタ", "ボルボ", "BMW"];
  // このブロック内では cars[0] は "トヨタ" です
}

// ここでは cars[0] は依然として "サーブ" です

一方で、var で宣言された配列はブロックスコープを持ちません。

var cars = ["サーブ", "ボルボ", "BMW"];
// ここで cars[0] は "サーブ" です

{
  var cars = ["トヨタ", "ボルボ", "BMW"];
  // ここで cars[0] は "トヨタ" です
}

// ここでも cars[0] は "トヨタ" に上書きされたままになります

ブロックスコープの詳細については、「JavaScript Scope」の章で詳しく学ぶことができます。

6. 配列の再宣言 (Redeclaring Arrays)

var で宣言された配列は、プログラム内のどこでも再宣言が許可されています。

var cars = ["ボルボ", "BMW"];   // 許可されます
var cars = ["トヨタ", "BMW"];   // 許可されます
cars = ["ボルボ", "サーブ"];     // 許可されます

しかし、同じスコープ内や同じブロック内で、既存の変数を const に再宣言したり、const 配列に再代入したりすることは許可されていません。

var cars = ["ボルボ", "BMW"];     // 許可されます
const cars = ["ボルボ", "BMW"];   // 許可されません（エラー）

{
  var cars = ["ボルボ", "BMW"];   // 許可されます
  const cars = ["ボルボ", "BMW"]; // 許可されません（エラー）
}

同様に、同じスコープやブロック内で既存の const 配列を再宣言または再代入することもできません。

const cars = ["ボルボ", "BMW"];   // 許可されます
const cars = ["ボルボ", "BMW"];   // 許可されません（再宣言不可）
var cars = ["ボルボ", "BMW"];     // 許可されません（再宣言不可）
cars = ["ボルボ", "BMW"];         // 許可されません（再代入不可）

{
  const cars = ["ボルボ", "BMW"]; // 許可されます
  const cars = ["ボルボ", "BMW"]; // 許可されません
  var cars = ["ボルボ", "BMW"];   // 許可されません
  cars = ["ボルボ", "BMW"];       // 許可されません
}

ただし、別のスコープや別のブロック内であれば、同じ名前で const 配列を宣言することが許可されています。

const cars = ["ボルボ", "BMW"];   // 許可されます

{
  const cars = ["ボルボ", "BMW"]; // 別のブロックなので許可されます
}

{
  const cars = ["ボルボ", "BMW"]; // 別のブロックなので許可されます
}