JavaScriptのtry/catch/finally文

定義と用法

try/catch/finally文は、コードブロック内で発生する可能性のある一部または全てのエラーを処理し、同時にコードを実行し続けます。

エラーは、プログラマーのエラーコード、誤入力によるエラー、その他予期せぬ状況によるものかもしれません。

try文は、実行時にエラーをテストするコードブロックを定義することができます。

tryブロックでエラーが発生した場合、catch文は実行するコードブロックを定義することができます。

finally文は、tryとcatchの後にコードを実行するのに使用されますが、結果に関わらずです。

注釈:catchとfinally文はオプションですが、try文を使用する場合、そのうちの1つ(または両方)を使用する必要があります。

ヒント:エラーが発生した場合、JavaScriptは通常停止し、エラーメッセージを生成します。カスタムエラー(例外)を作成するにはthrow文を使用してください。tryとcatchと一緒に使用すると、プログラムの流れを制御し、カスタムエラーメッセージを生成できます。

JavaScriptのエラーに関するより多くの情報は、JavaScriptエラートレーニングを学習してください。

この例では、コード(tryブロック内)でスペルミスをしています。

この例では「Welcome guest!」と表示されるべきですが、alertのスペルが間違っています。

catchブロックはエラーをキャッチし、それを処理するコードを実行します:

<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
try {
  adddlert("Welcome guest!");
}
catch(err) {
  document.getElementById("demo").innerHTML = err.message;
}
</script>
</body>
</html>

自分で試してみてください

ページの下部にTIY(Try It Yourself)の例があります。

文法

try {
  tryCode - 実行しようとするコードブロック
}
catch(err) {
  catchCode - エラーを処理するコードブロック
} 
finally {
  finallyCode - try / catchの結果に関わらず実行されるコードブロック
}

パラメータの値

パラメータ 説明
tryCode 必須。実行時にエラーをテストするコードブロック。
err 必須、catchと一緒に使用する場合。エラーを指定するローカル変数を指定します。この変数はErrorオブジェクト(例えば、メッセージ「'addlert' is not defined」に関する情報を含む)を参照することができます。throw文で生成された例外の場合、この変数はthrow文で指定されたオブジェクトを指します(「さらに詳しく」を参照)。
catchCode オプション。tryブロックでエラーが発生した場合に実行されるコードブロック。エラーが発生しなかった場合、このコードブロックは決して実行されません。
finallyCode オプション。try / catchの結果に関わらず、実行されるコードブロック。

技術詳細

JavaScriptバージョン: ECMAScript 3

さらに例

この例では、入力を確認します。値が間違っている場合、例外(err)をスローします。

catch文は、例外(err)をキャッチし、カスタムエラーメッセージを表示します:

<!DOCTYPE html>
<html>
<body>
<p>5から10の間の数字を入力してください:</p>
<input id="demo" type="text">
<button type="button" onclick="myFunction()">テスト入力</button>
<p id="message"></p>
<script>
function myFunction() {
  var message, x;
  message = document.getElementById("message");
  message.innerHTML = "";
  x = document.getElementById("demo").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) {
    message.innerHTML = "Input " + err;
  }
}
</script>
</body>
</html>

自分で試してみてください

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

function myFunction()
  var message, x;
  message = document.getElementById("message");
  message.innerHTML = "";
  x = document.getElementById("demo").value;
  try { 
    if(x == "") throw "Empty";
    if(isNaN(x)) throw "Not a number";
    if(x > 10) throw "Too high";
    if(x < 5) throw "Too low";
  }
  catch(err) {
    message.innerHTML = "エラー: " + err + ".";
  }
  finally {
    document.getElementById("demo").value = "";
  }
}

自分で試してみてください

ブラウザサポート

Chrome IE Firefox Safari Opera
try/catch/finally サポート サポート サポート サポート サポート

関連ページ

JavaScript チュートリアル:JavaScript エラー

JavaScript リファレンスマニュアル:JavaScript throw 文