コンパイル時のエラー | エラーの発生タイミング | JavaScript 超完全入門基本から発展までのすべて

INDEX

コンパイル時のエラーとは？

JavaScriptはインタプリタ型言語ですが、コードを実行する前に構文解析（パース）という処理が行われます。

この段階で文法に誤りがあると、コードは実行されずエラーになります。このようなエラーは、一般的に構文エラー（SyntaxError）と呼ばれます。

なお、「コンパイル時エラー」という表現は、JavaやC++などのコンパイル型言語でよく使われます。JavaScriptでは厳密にはコンパイルしているわけではありませんが、実行前に検出されるエラーという意味で使われることがあります。

JavaScriptで実行前に見つかる代表的なエラーをまとめます。

エラーの種類	発生原因	例	対策
`SyntaxError`	コードの文法が正しくない。	`console.log("Hello World);`	括弧や引用符など、構文が正しいか確認する。
`SyntaxError`	予約語の誤った使用。	`const if = 10;`	予約語を変数名や関数名に使用しない。
`SyntaxError`	括弧や波括弧の対応が取れていない。	`if (true) { console.log("Hello");`	括弧や波括弧が正しく対応しているか確認する。

一方、ReferenceErrorやTypeErrorは、多くの場合実行時エラーであり、コードが実際にその行まで実行されたときに発生します。

種類	発生するタイミング	代表例
構文エラー（SyntaxError）	コードを実行する前	閉じ括弧がない、予約語の誤使用など。
実行時エラー	コードを実行している途中	ReferenceError、TypeError、RangeErrorなど。

この違いを理解しておくと、エラーの原因を見つけやすくなります。

次のコードは、構文エラーが発生する例です。

console.log("Hello World);

このコードでは、文字列を囲む引用符が閉じられていません。

JavaScriptエンジンはコードを解析する段階で文法の誤りを検出するため、このコードは実行されず、SyntaxErrorが表示されます。

function hello() {
    console.log("Hello");

波括弧が閉じられていないため、構文エラーになります。

const user = {
    name: "Alice"
    age: 20
};

プロパティの間にカンマがないため、構文エラーになります。

const return = 10;

returnはJavaScriptの予約語なので、変数名として使用できません。

構文エラーは、多くの場合、実行前に開発ツールが検出してくれます。

ESLintはJavaScriptで最も広く使われている静的解析ツールの一つです。

例えば、次のようなコードを書いた場合でも、実行前に問題を指摘してくれます。

const message = "Hello"

console.log(message)

設定によっては、セミコロンの有無や未使用変数なども検出できます。

実際には、エラーメッセージが示す行よりも前の行に原因があることも多いため、周辺のコードも確認すると原因を見つけやすくなります。