SyntaxErrorとReferenceError | JavaScriptのエラー分類 | JavaScript 超完全入門 基本から発展までのすべて

amazon

プライム感謝祭

--:--:--

～

検索

ad. 価格範囲を指定して商品を探せます

SyntaxErrorとReferenceError

JavaScriptでは、コードに問題があるとエラーが発生します。エラーはプログラムの実行を止める原因になりますが、原因を理解すれば修正しやすくなります。

特によく見かけるのが、SyntaxErrorとReferenceErrorです。

SyntaxErrorは文法の間違い、ReferenceErrorは存在しない変数や関数の参照によって発生します。

SyntaxErrorとは？

SyntaxErrorは、JavaScriptの構文が正しくない場合に発生するエラーです。

コードがJavaScriptとして正しく解釈できないため、多くの場合は実行前の段階で検出されます。

SyntaxErrorの例

console.log("Hello World);

この例では、文字列を閉じるダブルクォートが不足しているため、SyntaxErrorになります。

SyntaxErrorが発生するケース

• 括弧やクォートを閉じ忘れている。
• カンマやセミコロンの位置が不適切である。
• if文や関数の書き方が間違っている。
• 予約語を不適切な場所で使っている。

ReferenceErrorとは？

ReferenceErrorは、存在しない変数や関数を参照した場合に発生するエラーです。

変数名のタイプミスや、スコープ外の変数を使おうとした場合によく発生します。

ReferenceErrorの例

console.log(myVariable);

この例では、myVariableが宣言されていないため、ReferenceErrorが発生します。

ReferenceErrorが発生するケース

• 宣言されていない変数を参照した。
• 変数名や関数名をタイプミスした。
• スコープの外にある変数を参照した。
• letやconstで宣言する前に変数へアクセスした。

SyntaxErrorとReferenceErrorの違い

SyntaxErrorの防止策

• 括弧、クォート、中括弧の閉じ忘れを確認する。
• コードエディタの構文チェック機能を利用する。
• ESLintやPrettierなどのツールを活用する。
• エラー行だけでなく、その直前の行も確認する。

ReferenceErrorの防止策

• 変数や関数を使用する前に宣言する。
• 変数名や関数名のタイプミスを確認する。
• スコープを意識して変数を定義する。
• letやconstは宣言前に使えないことを理解する。

初心者が知っておきたいポイント

• SyntaxErrorは、コードの文法が間違っているときに発生する。
• ReferenceErrorは、存在しない名前を参照したときに発生する。
• エラーメッセージには原因を特定するための重要な情報が含まれている。
• エラーが出た行だけでなく、その前後のコードも確認する。
• エディタやLinterを使うと、エラーを早く見つけやすい。

まとめ

• SyntaxErrorは、JavaScriptの構文が正しくない場合に発生する。
• ReferenceErrorは、未宣言の変数や存在しない関数を参照した場合に発生する。
• SyntaxErrorは実行前に検出されることが多い。
• ReferenceErrorはコード実行中に発生することが多い。
• エラーの種類を理解すると、原因を素早く特定しやすくなる。