JavaScriptのエラー「ReferenceError: is not defined」の原因と解決策

30秒でわかる原因と解決策

原因: スコープ内に存在しない変数名や関数名にアクセスしようとしたため。 解決策: 変数を使用する前に const や let で宣言するか、変数名や関数名のスペルミスを確認・修正します。

修正コード（Before / After）

❌ エラーが発生するコード

// 宣言していない変数を使おうとしてエラーになる例
function showMessage() {
  console.log(username); // ReferenceError: username is not defined
}

showMessage();

⭕ 修正後の推奨コード

// 変数を事前に宣言してから使用する
function showMessage() {
  const username = "Taro";
  console.log(username); // 出力: Taro
}

showMessage();

よくある発生パターンと解説

ReferenceError: is not defined は、JavaScriptにおける最も頻出するエラーの一つです。主に以下のようなシチュエーションで発生します。

1. 変数の宣言漏れ うっかり const、let、var をつけずに変数に値を代入・参照しようとした場合に発生します（特に use strict モードでは厳密にチェックされます）。
2. スペルミス（タイポ） 定義した変数名と、呼び出す際の変数名が異なっている場合（例: userNam と userName）に発生します。
3. スコープ（変数の有効範囲）の勘違い 別の関数内やブロック内で定義されたローカル変数を、外部から参照しようとした場合に発生します。
4. 外部スクリプトの読み込み順序ミス 依存しているライブラリや自作のJSファイルが、使用するコードよりも後に読み込まれている場合に発生します。

よくある質問 (FAQ)

Q1. ReferenceError と TypeError の違いは何ですか？

• ReferenceError: 存在しない変数や関数を参照しようとしたときに発生します。
• TypeError: 変数は存在するが、想定されていないデータ型に対して操作を行った場合（例：文字列に対して関数のように .map() を呼び出すなど）に発生します。

Q2. 「is not defined」と「is undefined」はどう違いますか？

• ReferenceError: X is not defined: 変数 X 自体がどこにも宣言されていません。
• X is undefined: 変数 X は var や let で宣言されているものの、まだ値が代入されていない状態です（エラーではなく、値が undefined であることを示します）。