X Tutup

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

const

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.

const 宣言はブロックスコープのローカル変数(定数)を宣言します。定数の値は代入演算子を使用して再代入することができませんが、定数がオブジェクトであった場合、そこにプロパティを追加したり、更新したり、削除したりすることができます。

試してみましょう

const number = 42;

try {
  number = 99;
} catch (err) {
  console.log(err);
  // 予想される結果: TypeError: invalid assignment to const 'number'
  // (注:正確な結果はブラウザー依存です)
}

console.log(number);
// 予想される結果: 42

構文

js
const name1 = value1;
const name1 = value1, name2 = value2;
const name1 = value1, name2 = value2, /* …, */ nameN = valueN;
nameN

宣言する変数名。それぞれ、正規の JavaScript 識別子または構造分解バインドパターンでなければなりません。

valueN

変数の初期値。正規の式であれば何でもかまいません。

解説

const 宣言は let とよく似ています。

  • const 宣言は、ブロックおよび関数のスコープになります。

  • const 宣言は宣言した位置に到達してからでないとアクセスすることができません(一時的デッドゾーンを参照してください)。このため、 const 宣言は一般的に巻き上げされないと見なされます。

  • スクリプトの最上位で宣言された場合、 const 宣言は globalThis にプロパティを作成しません。

  • const 宣言は、同じスコープ内の他の宣言によって再宣言することはできません。

  • const文ではなく宣言を始めます。つまり、ブロックの本体として単独の const 宣言を使用することはできません(変数にアクセスする手段がないので、理にかなっています)。

    js
    if (true) const a = 1; // SyntaxError: Lexical declaration cannot appear in a single-statement context
    

定数の初期化子が必要です。同じ宣言の中でその値を指定しなければなりません。(後で変更できませんので、理にかなっています。)

js
const FOO; // SyntaxError: Missing initializer in const declaration

const 宣言は値への不変の参照を作成します。これはその値が不変であるという意味ではなく、変数の識別子に再代入できないという意味です。例えば、内容がオブジェクトの場合、これはオブジェクトの内容(例えばプロパティ)は変更できることを意味しています。const 宣言は「アイデンティティが一定の変数を作成する」のであって、「値が一定の変数を作成する」のではありません。また、「不変のバインド」を作成するのであって、「不変の値」を作成するのではありません。

多くのスタイルガイド(MDN のものも含む)では、変数がそのスコープで再代入されない場合は、 constlet の代わりに使用することを推奨しています。これにより、変数の型(プリミティブの場合は値)が変更されることはないという意図が明確になります。また、プリミティブ以外の変数が変更される場合は let を推奨する人もいます。

const キーワードに続くリストはバインドリストと呼ばれ、カンマで区切られます。このカンマはカンマ演算子ではなく、 =代入演算子ではありません。後の変数の初期化子は、リスト内の前の変数を参照することができます。

基本的な定数の使い方

定数は大文字または小文字で宣言することができますが、特にプリミティブの場合は、本当に変更不可能であるので、すべて大文字で宣言するのが慣例です。

js
// MY_FAV を定数として定義して、その値を 7 にします
const MY_FAV = 7;

console.log(`my favorite number is: ${MY_FAV}`);
js
// 定数の値を再代入するとエラーが発生
MY_FAV = 20; // TypeError: Assignment to constant variable

// 定数を再宣言するとエラーが発生
const MY_FAV = 20; // SyntaxError: Identifier 'MY_FAV' has already been declared
var MY_FAV = 20; // SyntaxError: Identifier 'MY_FAV' has already been declared
let MY_FAV = 20; // SyntaxError: Identifier 'MY_FAV' has already been declared

ブロックスコープ

ブロックスコープの性質に注意することが重要です。

js
const MY_FAV = 7;

if (MY_FAV === 7) {
  // これは問題なく、ブロックスコープの MY_FAV 変数を作成します
  const MY_FAV = 20;
  console.log(MY_FAV); // 20

  // これはグローバルコンテキストに巻き上げられ、エラーが発生します
  var MY_FAV = 20; // SyntaxError: Identifier 'MY_FAV' has already been declared
}

console.log(MY_FAV); // 7

オブジェクトと配列の定数

const はオブジェクトや 配列にも作用します。オブジェクトを上書きしようとすると、"Assignment to constant variable" というエラーが発生します。

js
const MY_OBJECT = { key: "value" };
MY_OBJECT = { OTHER_KEY: "value" };

しかし、オブジェクトのキーは保護されていないので、次の文は問題なく実行されます。

js
MY_OBJECT.key = "otherValue";

オブジェクトを不変にするには、 Object.freeze() を使用する必要があります。

配列も同様です。新しい配列を変数に割り当てようとすると、"Assignment to constant variable" のエラーが発生します。

js
const MY_ARRAY = [];
MY_ARRAY = ["B"];

しかし、配列にアイテムを追加することはでき、変更は可能です。

js
MY_ARRAY.push("A"); // ["A"]

構造分解による宣言

それぞれの = の左辺はバインドパターンにもなります。これにより、一度に複数の変数を作成することができます。

js
const result = /(a+)(b+)(c+)/.exec("aaabcc");
const [, a, b, c] = result;
console.log(a, b, c); // "aaa" "b" "cc"

詳しくは、構造分解を参照してください。

仕様書

Specification
ECMAScript® 2026 Language Specification
# sec-let-and-const-declarations

ブラウザーの互換性

関連情報

X Tutup