データ（情報）を安全に格納する「箱」のルール

前回の記事で、JavaScriptが扱う「データ型」について学びましたね。そのデータ型（文字列、数値など）を実際にプログラム内で利用するには、一時的に情報を保存しておくための「箱」が必要です。この箱のことを変数と呼びます。

しかし、JavaScriptには、この箱の作り方や扱い方について、いくつかのルールがあります。特に重要なのが、var、let、constという3つのキーワードで、これらを正しく使い分けることが、バグの少ない、安定したコードを書くための鍵となります。

今回は、この3つの変数の違いと、「スコープ」という、変数が利用できる範囲のルールについて深く掘り下げていきましょう。

1. 変数宣言の3つのキーワード

varはJavaScriptが生まれた頃からある古い宣言方法です。現在ではほとんど使われていません。

JavaScript

var name = "Alice";
var name = "Bob"; // 同じ名前で再宣言できてしまう（危険）

letは、現代のJavaScriptで最も標準的に使われる宣言方法です。

JavaScript

let count = 0;
// let count = 10; // ← エラーになる（再宣言は不可能）
count = 1;        // ← 成功（再代入は可能）

constは「Constant（定数）」の略で、一度値を入れたら二度と変更できない変数を宣言します。

JavaScript

const TAX_RATE = 0.1;
// TAX_RATE = 0.08; // ← エラーになる（再代入は不可能）

Web制作では、値が変わらない変数（定数）が多いため、基本的にはconstを使い、値を変える必要があるときだけletを使うのが現在の主流です。

変数がコードのどの範囲で利用できるかという「有効範囲」のことをスコープと呼びます。このスコープのルールが、varとlet/constで大きく異なります。

letとconstはブロックスコープを持ちます。「ブロック」とは、if文やfor文、関数などで使われる**波括弧 {}**で囲まれた範囲のことです。

letやconstで宣言された変数は、この{}の外側からはアクセスできません。これにより、予期せぬ外部からの干渉を防ぎ、安全性が高まります。

JavaScript

function checkScope() {
  if (true) {
    let message = "ブロック内"; // この変数は外から見えない
  }
  // console.log(message); // ← エラー: messageは定義されていません
}

一方、varは関数スコープを持ちます。これは、varで宣言された変数が、関数全体を通してどこからでもアクセスできることを意味します。if文やfor文の{}はスコープを区切りません。

JavaScript

function checkVarScope() {
  if (true) {
    var greeting = "こんにちは"; // ifブロックの外でも有効
  }
  console.log(greeting); // ← 成功: "こんにちは"
}

この「ブロックを無視する」という性質が、大規模なプログラムで混乱やバグを引き起こす最大の原因となるため、varは非推奨とされているのです。

安定したJavaScriptのコードを書くための最も簡単なルールは、以下の通りです。

このルールを守るだけで、あなたのコードは格段に読みやすく、そして安全になります。変数を宣言するときは、そのデータが「今後変わるのか、変わらないのか」を必ず意識しましょう。