JavaScriptを試して...キャッチ...最後に
例
この例では、 tryブロックにタイプミスがあります。アラートのスペルが間違っています。
catchブロックはエラーをキャッチし、それを処理するコードを実行します。
<p id="demo"></p>
<script>
try {
adddlert("Welcome guest!");
}
catch(err) {
document.getElementById("demo").innerHTML = err.message;
}
</script>
以下のその他の例。
定義と使用法
エラーが発生すると、JavaScriptは停止し、エラーメッセージを生成します。
ノート
これの専門用語は次のとおりです。JavaScriptは例外をスローします。
JavaScriptは、nameとmessageの2つのプロパティを 持つErrorオブジェクトを作成します。
try...catch...finally
ステートメントコンボは、JavaScriptを停止せずにエラーを処理します。
このtry
ステートメントは、実行する(試行する)コードブロックを定義します。
このcatch
ステートメントは、エラーを処理するためのコードブロックを定義します。
このfinally
ステートメントは、結果に関係なく実行するコードブロックを定義します。
このthrow
ステートメントは、カスタムエラーを定義します。
catch
とはどちらfinally
もオプションですが、どちらかを使用する必要があります。
ノート
tryとcatchでthrowを使用すると、プログラムフローを制御し、カスタムエラーメッセージを生成できます。
関連項目:
構文
try {
tryCode - Code block to run
}
catch(err) {
catchCode -
Code block to handle errors
}
finally {
finallyCode - Code block to be executed regardless of the try result
}
パラメーター
Parameter | Description |
tryCode | Required. Code block to be tested while executing. |
err | A local reference to the error object. |
catchCode | Optional. Code block to execute if an error occurs. |
finallyCode | Optional. Code block to execute regardless of the try result |
その他の例
この例では、入力を調べます。
値が間違っている場合、例外(err)がスローされます。
<p>Please input a number between
5 and 10:</p>
<input id="demo" type="text">
<button type="button"
onclick="myFunction()">Test Input</button>
<p id="message"></p>
<script>
function myFunction() {
const message =
document.getElementById("message");
message.innerHTML = "";
let 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>
finallyステートメントは、試行結果に関係なく、コードを実行します。
function myFunction()
const message =
document.getElementById("message");
message.innerHTML = "";
let 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 = "Error: " +
err + ".";
}
finally {
document.getElementById("demo").value = "";
}
}
ブラウザのサポート
try...catch
ECMAScript3(ES3)機能です。
ES3(JavaScript 1999)は、すべてのブラウザーで完全にサポートされています。
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | Yes | Yes | Yes | Yes | Yes |