JavaScript | 基礎構文:スコープ・実行コンテキスト – ブロックスコープ

JavaScript JavaScript
スポンサーリンク

ブロックスコープとは何か

スコープとは「変数がどこから見えるか(使えるか)」の範囲のことです。
その中で ブロックスコープ は、{ } で囲まれたブロックの中だけで有効なスコープを指します。if 文や for 文などの中で宣言された変数は、そのブロックの外からは使えません。

ここが重要です:
JavaScript では letconst で宣言した変数はブロックスコープを持つ のに対し、古い書き方の var はブロックスコープを持たず、関数スコープになる という違いがあります。初心者が混乱しやすいポイントなので、特に意識して覚えておく必要があります。


実行コンテキストとの関係

コードが実行されるとき、JavaScript は「実行コンテキスト」という環境を作ります。関数を呼び出すと関数実行コンテキストが作られ、その中でさらにブロックスコープが追加されます。

つまり変数を探すときは、

  1. まずそのブロックの中を探す
  2. 見つからなければ外側のスコープへ
  3. 最後にグローバルスコープへ
    という順番で探索されます。

例題で理解する

例題1:ブロックの中だけで有効

if (true) {
  let x = 10;
  console.log(x); // 10
}

console.log(x); // エラー: x は定義されていません
JavaScript

xif のブロックの中でしか使えません。外から参照するとエラーになります。


例題2:var の違い

if (true) {
  var y = 20;
  console.log(y); // 20
}

console.log(y); // 20 (外からも見えてしまう)
JavaScript

var はブロックスコープを持たないため、外からも参照できます。これが予期せぬバグの原因になることがあります。


例題3:for 文のブロックスコープ

for (let i = 0; i < 3; i++) {
  console.log(i);
}

console.log(i); // エラー: i は定義されていません
JavaScript

ifor のブロックの中だけで有効です。外からは使えません。


ブロックスコープの重要性

変数の衝突を防ぐ

同じ名前の変数を別のブロックで使っても、互いに干渉しません。

let name = "太郎";

if (true) {
  let name = "花子";
  console.log(name); // 花子
}

console.log(name); // 太郎
JavaScript

コードの安全性が高まる

var を使うと意図せず外側に影響を与えることがありますが、letconst を使えばブロックの中に閉じ込められるので安全です。

実行コンテキストを整理できる

ブロックスコープを意識すると「どこで変数が生きているか」が明確になり、コードの見通しが良くなります。


まとめ

  • ブロックスコープは { } の中だけで有効なスコープ。
  • letconst はブロックスコープを持ち、var は持たない。
  • 外から参照できないため、変数の衝突や予期せぬバグを防げる。
  • 実行コンテキストの中でブロックスコープが積み重なり、内側から外側へ順に変数を探す仕組みになっている。

初心者は「ブロックスコープは“波括弧の中だけで生きる変数の世界”」とイメージすると理解しやすいです。

タイトルとURLをコピーしました