JavaScriptの変数・定数宣言について
var宣言
var
は、JavaScriptで最初に導入された変数宣言の方法です。var
で宣言された変数は、以下の特徴を持ちます。
- 関数スコープを持つ(ブロックスコープではない)。
- 再宣言が可能。
- 初期化前にアクセス可能(値は
undefined
)。
例:
var x = 10; console.log(x); // 10 if (true) { var x = 20; // 同じ変数を再宣言 console.log(x); // 20 } console.log(x); // 20 (ブロックスコープがないため値が上書きされる)
let宣言
let
はES6で導入された変数宣言の方法です。以下の特徴があります。
- ブロックスコープを持つ。
- 再宣言が不可。
- 初期化前にアクセスするとエラー(
Temporal Dead Zone
)。
例:
let y = 10; console.log(y); // 10 if (true) { let y = 20; // ブロック内の新しいスコープで宣言 console.log(y); // 20 } console.log(y); // 10 (外部スコープの変数は影響を受けない)
const宣言
const
もES6で導入され、定数を宣言するために使います。特徴は以下の通りです。
- ブロックスコープを持つ。
- 再宣言不可。
- 再代入不可(オブジェクトや配列の中身の変更は可能)。
- 宣言時に必ず初期化が必要。
例:
const z = 30; console.log(z); // 30 // 再代入はエラー // z = 40; // TypeError const arr = [1, 2, 3]; arr.push(4); // オブジェクトの中身は変更可能 console.log(arr); // [1, 2, 3, 4]
スコープの違い
変数のスコープとは、変数が有効な範囲のことです。
var
: 関数スコープ。let
とconst
: ブロックスコープ。
例:
function test() { if (true) { var a = 1; // 関数スコープ let b = 2; // ブロックスコープ const c = 3; // ブロックスコープ } console.log(a); // 1 // console.log(b); // ReferenceError // console.log(c); // ReferenceError } test();
再宣言と再代入
各宣言方法の再宣言と再代入の可否をまとめます。
宣言方法 | 再宣言 | 再代入 |
---|---|---|
var | 可能 | 可能 |
let | 不可 | 可能 |
const | 不可 | 不可 |
巻き上げ(hoisting)
変数宣言は、スクリプトや関数の先頭に巻き上げられる挙動を持ちます。var
は宣言が巻き上げられるため、初期化前にアクセスするとundefined
が返されます。一方、let
とconst
は巻き上げはされますが、Temporal Dead Zone
により初期化前にアクセスするとエラーになります。
例:
console.log(a); // undefined (宣言は巻き上げられる) var a = 10; // console.log(b); // ReferenceError (Temporal Dead Zone) // let b = 20; // console.log(c); // ReferenceError (Temporal Dead Zone) // const c = 30;
推奨される宣言方法
現代のJavaScriptでは、let
とconst
を使うことが推奨されます。再代入が不要な場合はconst
を使用し、必要な場合にのみlet
を使います。var
は非推奨とされています。
推奨例:
const name = "太郎"; let age = 20; age = 21; // 再代入はOK // name = "次郎"; // エラー