例外処理

この章ではJavaScriptにおける例外処理について学びます。

try...catch構文

try...catch構文は例外が発生しうるブロックをマークし、例外が発生したときの処理を記述するための構文です。 次の例のように、try文にはひとつのtryブロックがあり、tryブロック内で発生した例外をcatch節でキャッチします。

tryブロック内で例外が発生すると、それ以降の文は実行されずcatch節に処理が移ります。 finally節が存在するときには、例外がなげられたかどうかにかかわらず、かならずtry文の最後に実行されます。

try {
    console.log("この文は実行されます");
    // 未定義の関数を呼び出してReferenceError例外が発生する
    undefinedFunction();
    console.log("この文は実行されません");
} catch (error) {
    // 例外が発生したあとはこのブロックが実行される
    console.log("この文は実行されます");
    console.log(error instanceof ReferenceError); // => true
    console.log(error.message); // => "undefinedFunction is not defined"
} finally {
    // このブロックはかならず実行される
    console.log("この文は実行されます");
}

また、catch節とfinally節のうち、片方が存在していれば、もう片方の節は省略できます。 finally節のみを書いた場合は例外がキャッチされないため、finally節を実行後に例外が発生します。

// catch節のみ
try {
    undefinedFunction();
} catch (error) {
    console.log(error);
}
// finally節のみ
try {
    undefinedFunction();
} finally {
    console.log("この文は実行されます");
}
// 上記のtry-finnalyで例外がキャッチされていないため
console.log("この文は実行されません");

throw文

throw文を使うとユーザーが例外を投げることができます。 例外として投げられたオブジェクトは、catch節で関数の引数のようにアクセスできます。 catch節でオブジェクトを参照できる識別子を例外識別子と呼びます。

try {
    // 独自の例外を投げる
    throw new Error("例外が投げられました");
} catch (error) {
    // catch節のスコープでerrorにアクセスできる
    console.log(error.message); // => "例外が投げられました"
}

エラーオブジェクト

throw文ではエラーオブジェクトを例外として投げることができます。

Error

ErrorオブジェクトのインスタンスはErrornewして作成します。 コンストラクタの第一引数には、エラーの内容をあらわす文字列を渡します。 渡した文字列はError#messageプロパティに格納されます。

次の例では、assertPositiveNumber関数でエラーオブジェクトを作成し、例外としてthrowしています。 投げられたオブジェクトはcatch節の例外識別子から取得でき、エラーメッセージが確認できます。

// 渡された数値が0未満であれば例外を投げる関数
function assertPositiveNumber(num) {
    if (num < 0) {
        throw new Error(`${num} is not positive.`);
    }
}

try {
    assertPositiveNumber(-1);
} catch (error) {
    console.log(error instanceof Error); // => true
    console.log(error.message); // => "-1 is not positive."
}

throw文はあらゆるオブジェクトを例外として投げられますが、基本的にはErrorオブジェクトのインスタンスを投げることが推奨されます。 その理由は後述するスタックトレースのためです。 Errorオブジェクトはインスタンスの作成時に、そのインスタンスが作成されたファイル名や行数などのデバッグに役立つ情報をもっています。 文字列のようなErrorオブジェクトでないオブジェクトを投げてしまうと、スタックトレースが得られません。

// 文字列を例外として投げるアンチパターンの例
try {
    throw "例外が投げられました";
} catch (error) {
    console.log(error); // => "例外が投げられました"
}

ビルトインエラー

JavaScriptエンジンが投げる組み込みのエラーのことをビルトインエラーと呼びます。 ビルトインエラーとして投げられるエラーオブジェクトは、すべてErrorオブジェクトから派生したオブジェクトのインスタンスです。 そのため、ユーザーが定義したエラーと同じように例外処理できます。

ビルトインエラーはいくつか種類がありますが、ここでは代表的なものを紹介します。

ReferenceError

ReferenceErrorは存在しない変数や関数などの識別子が参照された場合のエラーです。 たとえば次のようなコードを実行すると、ReferenceError例外が投げられます。

try {
    // 存在しない変数を参照する
    console.log(x);
} catch (error) {
    console.log(error instanceof ReferenceError); // => true
    console.log(error.name); // => "ReferenceError"
    console.log(error.message); // エラーの内容が表示される
}

SyntaxError

SyntaxErrorは構文的に不正なコードを解釈しようとした場合のエラーです。 SyntaxError例外はJavaScriptを実行する前のパース段階で発生します。 この構文エラーはtry...catch文でcatchすることはできません。

// 正しくない構文
foo! bar!

たとえば次のようなコードを実行すると、SyntaxError例外が発生します。 ここではeval関数を使って動的にJavaScriptを解釈することで、実行時にSyntaxErrorを発生させています。

try {
    // eval関数は渡した文字列をJavaScriptとして実行する関数
    // 正しくない構文をパースさせ、SyntaxErrorを実行時に発生させる
    eval("foo! bar!");
} catch (error) {
    console.log(error instanceof SyntaxError); // => true
    console.log(error.name); // => "SyntaxError"
    console.log(error.message); // エラーの内容が表示される
}

TypeError

TypeErrorは値が期待される型でない場合のエラーです。 たとえば次のようなコードを実行すると、TypeError例外が投げられます。

try {
    // 関数でないオブジェクトを関数として呼び出す
    const fn = {};
    fn();
} catch (error) {
    console.log(error instanceof TypeError); // => true
    console.log(error.name); // => "TypeError"
    console.log(error.message); // エラーの内容が表示される
}

ビルトインエラーを投げる

ユーザーがビルトインエラーのインスタンスを作成することもできます。 通常のErrorオブジェクトと同じように、それぞれのオブジェクトをnewします。 たとえば関数の引数を数値に限定したい場合は、次のようにTypeError例外を投げるとよいでしょう。 メッセージを確認しなくても、エラーの名前だけで型に関する例外だとすぐにわかります。

// 文字列を反転する関数
function reverseString(str) {
    if (typeof str !== "string") {
        throw new TypeError(`${str} is not a string`);
    }
    return str.split("").reverse().join("");
}

try {
    // 数値を渡す
    reverseString(100);
} catch (error) {
    console.log(error instanceof TypeError); // => true
    console.log(error.name); // => "TypeError"
    console.log(error.message); // "100 is not a string"
}

エラーとデバッグ

JavaScript開発においてデバッグ中に発生したエラーを理解することは非常に重要です。 エラーがもつ情報を活用することで、ソースコードのどこでどのような例外が投げられたのか知ることができます。

エラーはすべてErrorオブジェクトを拡張したオブジェクトで宣言されています。 つまり、エラーの名前をあらわすnameプロパティと内容をあらわすmessageプロパティをもっています。 この2つのプロパティを確認することで、多くの場面で開発の助けとなるでしょう。

次のコードではtry文で囲っていない部分で例外を投げています。

function fn() {
    // 存在しない変数を参照する
    x++;
}
fn();

このスクリプトを読み込むと、投げられた例外についてのログがコンソールに出力されます。 ここではFirefoxにおける実行例を示します。

コンソールでのエラー表示(Firefox)

このエラーログには次の情報が含まれています。

メッセージ 意味
ReferenceError: x is not defined エラーの種類はReferenceErrorで、xが未定義であること
error.js:3:5 例外がerror.jsの3行目5列目で発生したこと。つまりx++;であること。

また、メッセージの後には例外のスタックトレースが表示されています。

  • スタックトレースの最初の行が実際に例外が発生した場所です。つまり、3行目の x++; で例外が発生しています
  • 次の行には、そのコードの呼び出し元が記録されています。つまり、3行目のコードを実行したのは5行目のfn関数の呼び出しです

このように、スタックトレースは上から下へ呼び出し元を辿れるように記録されています。

コンソールに表示されるエラーログには多くの情報が含まれています。 MDNのJavaScriptエラーリファレンスには、ブラウザが投げるビルトインのエラーについて種類とメッセージが網羅されています。 開発中にビルトインエラーが発生したときには、リファレンスを見て解決方法を探すとよいでしょう。