JavaScript エラーハンドリング

JavaScriptコードを実行する際には、予期せぬエラーが発生する可能性があります。

エラーは、プログラマーが書いたコードのエラー、入力エラーによるエラー、または予期せぬことなどが原因で発生する可能性があります。

したがって、エラーを処理するために、JavaScriptは以下を提供します。4キーワード：

• tryステートメントを使用して、コードブロックにエラーがあるかどうかをテストできます。

• catchステートメントを使用して、エラーを処理できます。

• throwステートメントを使用して、カスタムエラーを作成できます。

• finallyステートメントは、試行およびキャッチの後に結果に関わらずにコードを実行できるようにします。

この例では、「alert」を「aaalert」として意図的にエラーを発生させることを行います：

try {
aaalert("Hello world");
}
document.getElementById("result").innerHTML = e.name　+　"<br>"　+　e.message;
}

エラーが発生した場合、JavaScriptは通常実行を停止し、2つの属性を持つオブジェクトを生成します。Errorオブジェクト：nameとmessage。

JavaScript try ... catch文

tryステートメントは、実行時にエラーテストを実行するコードブロックを定義する許可を与えます。

tryブロック内でエラーが発生した場合、このステートメントは実行するコードブロックを定義する許可を与えます。

JavaScriptの文tryとcatchは対で現れます：

try {
　　//try_statements-tryを試みる文
}catch（err）{
　　//catch_statements-エラー処理の文
}

JavaScript throw文

throw文は、ユーザー定義の例外を発生させることを許可します。

throw文は、カスタムエラーを作成することができます。技術的には、これを「例外を発生させる ”。

例外はJavaScriptの文字列、数字、ブール値またはオブジェクトでできます：

　　throw "Invalid";　　//　文字列値を持つ例外を生成
　　throw　32;　　　//　生成値が32の例外
　　throw true;　　　//　true値の例外を生成

throwとtryおよびcatchを使用して、プログラムの流れを指定し、カスタムエラーメッセージを生成できます。

この例では、getRectArea()に非数字の引数を渡した場合に、例外が発生し、カスタムエラーメッセージが生成されます：

function　getRectArea(width,　height)　{
　　　if　(isNaN(width)　||　isNaN(height))　{
　　throw "Parameter is not a number!";
　　　}
}
try {
　　　getRectArea(5,　'Z');
}
catch(err) {
　　　document.getElementById('para').innerHTML = err;
}

入力検証の例

この例では、値が間違っている場合に例外（err）が発生し、catch文が例外（err）をキャッチし、カスタムエラーメッセージを表示します：

var x = document.querySelector("input").value;
try {
　　　if(x == "")    throw "is Empty";
　　　if(isNaN(x))    throw "Not a Number";
　　　if(x >　10)    throw "too High";
　　　if(x <　5)throw "too Low";
}
catch(err) {
　　　document.getElementById("para").innerHTML = "Input "　+　err;
}

JavaScriptの最終文

このfinally文は、tryとcatchの後でコードを実行できるようにします。catchは結果に関わらず実行されます。

try {
　　　aaalert("Hello world");
}
catch(err) {
　　　document.getElementById("result").innerHTML = err;
}
finally {
　　　document.getElementById("result").innerHTML　+= "<h3>Finally statement executed</h3>";
}

catchとfinally文は任意ですが、try文を使用してそのうちの1つ（または両方）を使用する必要があります：

try {
　　　aaalert("Hello world");
}
finally {
　　　document.getElementById("result").innerHTML = "Finally statement executed";
}

JavaScriptエラーオブジェクト

JavaScriptにはエラーが発生したときにエラーメッセージを提供する内蔵のErrorオブジェクトがあります。

エラーオブジェクトはnameとmessageという2つの有用な属性を提供します。

エラーオブジェクト属性

以下の表にErrorオブジェクトの属性を示します：

エラータイプ

error name属性は7つの異なる値を返すことができます：

次の節では、これらのエラータイプの各ものを詳細に紹介します。

EvalError

次の節では、これらのエラータイプの各ものを詳細に紹介します。eval()関数の実行中にエラーが発生すると、EvalErrorがthrowされます。

しかし、JavaScriptはこのエラーをthrowしませんが、後方互換性のためにこのオブジェクトは保持されています。

新しいバージョンのJavaScriptではEvalErrorをthrowしません。代わりにSyntaxErrorを使用します。

RangeError

許可範囲外の数字を使用するとRangeErrorが発生します。

例えば、長さが負の数の配列を作成するとRangeErrorが発生します：

try {
var arr = new Array(-1);　//　range errorをthrowします
}
document.getElementById("result").innerHTML = err.name　+　"<br>"　+　err.message;
}

ReferenceError

存在しない変数やオブジェクトを参照しようとすると、通常はReferenceErrorが発生します。

try {
var x ==　5　+　y;　//　throw a reference error
}
document.getElementById("result").innerHTML = err.name　+　"<br>"　+　err.message;
}

SyntaxError

Your JavaScript code has any syntax errors, SyntaxError will be raised at runtime.

try {
eval("alert('Hello)");　　　//　Missing ' will throw an error
}
document.getElementById("result").innerHTML = err.name　+　"<br>"　+　err.message;
}

TypeError

値が期待されるタイプでない場合、TypeErrorが投げられます。

var num =　50;
try {
num.toUpperCase();　　　//　You cannot convert a number to uppercase
}
document.getElementById("result").innerHTML = err.name　+　"<br>"　+　err.message;
}

URIError

無効なURI（統一リソース識別子）を指定した場合、URIErrorが発生します。

try {
decodeURI("%");　　　//　You cannot URI decode percent sign
}
document.getElementById("result").innerHTML = err.name　+　"<br>"　+　err.message;
}

完全なエラーレファレンス

完全な属性とメソッドのリファレンスについては、私たちのJavaScriptエラーレファレンス。

参考部分には、すべてのError属性とタイプの説明と例が含まれています。