JavaScript入門：ブロックスコープとは？
プログラミング初心者がよくつまずくのが「変数の見える範囲（スコープ）」です。
その中でも ブロックスコープ はとても大事な概念です。
スコープとは？
スコープとは「変数が使える範囲」のこと。
変数はどこからでも使えるわけではなく、宣言した場所によって「見える範囲」が決まります。
ブロックスコープとは？
ブロックスコープは { } （波括弧）の中だけで有効なスコープのことです。
letとconstで宣言した変数はブロックスコープを持ちます。varはブロックスコープを持たず、関数スコープになるので注意。
例題で理解しよう
例1：ブロックスコープの基本
if (true) {
let x = 10;
console.log(x); // 10
}
console.log(x); // エラー！外からは見えない
👉 x は { } の中だけで有効。外からは参照できない。
例2：constも同じ
{
const y = 20;
console.log(y); // 20
}
console.log(y); // エラー！ブロック外では使えない
例3：varはブロックスコープを持たない
if (true) {
var z = 30;
}
console.log(z); // 30（外からも見える！）
👉 var はブロックを無視して外からも見えてしまう。これがバグの原因になることが多い。
例4：ループでの違い
for (let i = 0; i < 3; i++) {
console.log(i); // 0,1,2
}
console.log(i); // エラー！ブロック外では見えない
for (var j = 0; j < 3; j++) {
console.log(j); // 0,1,2
}
console.log(j); // 3（外からも見える）
👉 ループのカウンタは let を使うのが安全。
ブロックスコープを使うメリット
- 変数が外に漏れないので 予期せぬ上書きや衝突を防げる
- コードの見通しが良くなる
- 安全でバグが少ない
練習問題
- 次のコードを実行するとどうなる？
{
let a = 100;
}
console.log(a);
👉 エラー。a はブロック外から見えない。
- 次のコードの出力は？
{
var b = 200;
}
console.log(b);
👉 200。var はブロックスコープを持たない。
- ループのカウンタを
letで宣言した場合、ループ外から参照できるか？
for (let k = 0; k < 2; k++) {
console.log(k);
}
console.log(k);
👉 エラー。k はループブロック内だけ有効。
まとめ
- ブロックスコープは
{ }の中だけで有効な変数の範囲。 letとconstはブロックスコープを持つ。varはブロックスコープを持たず、外からも見えてしまう。- ループや条件分岐では
let/constを使うのが基本。
👉 ブロックスコープを理解すると「変数の見える範囲」が明確になり、バグを防げます。次は「グローバルスコープ」と「ローカルスコープ」を学ぶとさらに理解が深まります。