コードラボJP
プライバシーポリシー お問い合わせ サイトマップ

JavaScript Const

const キーワードは ES6（2015年）で導入されました。

const で定義された変数は再宣言できません。

const で定義された変数は再代入できません。

const で定義された変数はブロックスコープを持ちます。

再代入できません

const キーワードで定義された変数は再代入できません:


const PI = 3.141592653589793;
PI = 3.14;      // これはエラーになります
PI = PI + 10;   // これもエラーになります

代入が必要です

JavaScript の const 変数は宣言時に値を代入する必要があります:

正しい:


const PI = 3.14159265359;

間違い:


const PI;
PI = 3.14159265359;

JavaScript const を使用するタイミング

値が変更されるべきでないことが明確な場合には常に const で変数を宣言します。

const を使用して宣言する場合:

  • 新しい配列
  • 新しいオブジェクト
  • 新しい関数
  • 新しい正規表現

定数オブジェクトと配列

const キーワードは少し誤解を招くことがあります。

それは定数値を定義するのではなく、値への定数参照を定義します。

そのため、次の操作はできません:

  • 定数値の再代入
  • 定数配列の再代入
  • 定数オブジェクトの再代入

しかし、次の操作はできます:

  • 定数配列の要素の変更
  • 定数オブジェクトのプロパティの変更

定数配列

定数配列の要素を変更することができます:


// 定数配列を作成できます:
const cars = ["Saab", "Volvo", "BMW"];

// 要素を変更できます:
cars[0] = "Toyota";

// 要素を追加できます:
cars.push("Audi");

しかし、配列を再代入することはできません:


const cars = ["Saab", "Volvo", "BMW"];

cars = ["Toyota", "Volvo", "Audi"];    // エラー

定数オブジェクト

定数オブジェクトのプロパティを変更することができます:


// 定数オブジェクトを作成できます:
const car = {type:"Fiat", model:"500", color:"white"};

// プロパティを変更できます:
car.color = "red";

// プロパティを追加できます:
car.owner = "Johnson";

しかし、オブジェクトを再代入することはできません:


const car = {type:"Fiat", model:"500", color:"white"};

car = {type:"Volvo", model:"EX60", color:"red"};    // エラー

重要

var、let、const の違い

スコープ 再宣言 再代入 巻き上げ thisにバインド
var No Yes Yes Yes
let Yes No Yes No
const Yes No No No

良い点

let と const はブロックスコープを持ちます。

let と const は再宣言できません。

let と const は使用する前に宣言しなければなりません。

let と const は this にバインドしません。

let と const は巻き上げされません。

注意

Internet Explorer 11以前では let と const キーワードはサポートされていません。

最初の完全なサポートが始まったブラウザのバージョンに関する情報は以下の表をご参照ください:

Chrome 49 Edge 12 Firefox 36 Safari 11 Opera 36
2016年3月 2015年7月 2015年1月 2017年9月 2016年3月

ブロックスコープ

const キーワードで変数を宣言する場合、ブロックスコープに関しては let と類似しています。

この例では、ブロック内で宣言された x と、ブロック外で宣言された x は異なります:


const x = 10;
// ここでは x は 10 です

{
  const x = 2;
  // ここでは x は 2 です
}

// ここでは x は 10 です

再宣言

JavaScript の var 変数を再宣言することはプログラムのどこでも許可されています:


var x = 2;     // 許可されています
var x = 3;     // 許可されています
x = 4;         // 許可されています

既存の var 変数または let 変数を同じスコープで const に再宣言することは許可されません:


var x = 2;     // 許可されています
const x = 2;   // 許可されていません

{
  let x = 2;     // 許可されています
  const x = 2;   // 許可されていません
}

{
  const x = 2;   // 許可されています
  const x = 2;   // 許可されていません
}

既存の const 変数を同じスコープで再代入することは許可されません:


const x = 2;     // 許可されています
x = 2;           // 許可されていません
var x = 2;       // 許可されていません
let x = 2;       // 許可されていません
const x = 2;     // 許可されていません

{
  const x = 2;   // 許可されています
  x = 2;         // 許可されていません
  var x = 2;     // 許可されていません
  let x = 2;     // 許可されていません
  const x = 2;   // 許可されていません
}

巻き上げ

var で定義された変数はプログラムの先頭に巻き上げられ、いつでも初期化できます。

つまり、宣言する前に変数を使用することができます:


// これはOKです:
carName = "Volvo";
var carName;

巻き上げされた const 変数もプログラムの先頭に巻き上げられますが、初期化はされません。

つまり、宣言する前に const 変数を使用すると ReferenceError が発生します:


alert (carName);
const carName = "Volvo";