ホーム プログラミング言語 Web関連 javascript JS try catch の使用法: 例外処理

JS try catch の使用法: 例外処理


 
 
プログラミングでは、コードが意図したとおりに実行されないことがあり、コード内で間違ったシンボルを使用する、未定義のメソッドを呼び出す、ネットワーク エラー、存在しないファイルを読み取る、操作権限がないなど、さまざまなエラーが発生します。

 

JavaScriptプログラミングのエラーは、種類によって大きく以下の3種類に分けられます。

  • 構文エラー: 解析エラーとも呼ばれ、通常、コードの文法エラーが原因で発生します。構文エラーが発生すると、コードは実行を停止します。
  • 実行時エラー: 例外とも呼ばれ、未定義のメソッドの呼び出し、存在しないファイルの読み取りなど、プログラムの実行中に発生します。実行時エラーは実行中のコードも終了します。
  • 論理エラー: これは、見つけるのが最も難しいタイプのエラーです. 論理エラーは通常、プログラムが予期しない結果を出力したり、操作を終了させたりするコードの欠陥によって引き起こされます.

エラーと例外の違い

コードが実行される前にエラーが発生します. JavaScript プログラムを実行する前に, JavaScript インタプリタは最初にコードをチェックします. 文法上のエラーなどコードが間違っている場合, ブラウザは対応するエラーを報告します. コードのみが実行されるまで実行されません.エラーが修正されます。

未定義のメソッドの呼び出し、存在しないファイルの読み取りなど、コードの実行中に例外 (Exception) が発生します。例外が発生する前はコードの実行に影響はなく、例外が発生するとブラウザのコンソールにエラーメッセージが出力され、プログラムが終了します。

JS 例外処理

例外処理の目的は、例外が原因でプログラム全体が終了しないように、例外を生成するコードをキャッチすることです。 JavaScript では、try catch ステートメントを使用して例外をキャッチし、それに応じて処理できます。構文は次のとおりです。

try {
// 例外をスローする可能性のあるコード
} catch(error) {
// 例外発生時のアクション
}

例外を引き起こす可能性のある任意のコードを try ステートメント ブロックに配置し、例外を処理する方法を catch ステートメント ブロックで定義できます。 try ステートメント ブロック内のコードでエラーが発生した場合、コードは try ステートメント ブロックから catch ステートメント ブロックにすぐにジャンプします.try ステートメント ブロック内のコードでエラーが発生していない場合、catch ステートメント ブロック内のコードは、無視されます。

JS サンプル コードは次のとおりです。

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript</title>
</head>
<body>
     <script>
        try {
            var title = "JavaScript";
            document.write(title);
            // 未定義の変数を呼び出す
            document.write(str);
            // エラーが発生した場合、以下の行は実行されない
            alert("すべてのステートメントが正常に実行されました。");
        } catch(error) {
            // エラーを処理する
            alert("エラーメッセージ: " + error.message);
        }
        // 次のコードを続けて実行する
        document.write("<p>Hello World!</p>");
    </script>
</body>
</html> 

実行結果は次の図のとおりです。

図 1: JS の try catch の使用例
図 1: JS の try catch の使用例

try ステートメント ブロック内のコードで例外が発生すると、エラー オブジェクト (上記のコードのcatch(error)など) が作成され、スローされます. オブジェクトには、次のように 2 つの属性が含まれます。

  • 名前: タイプが間違っています。
  • メッセージ: エラーの説明。

JS try catch 最終ステートメント

try catch ステートメントの後に、finally ステートメント ブロックを追加することもできます。try ステートメント ブロック内のコードにエラーがあるかどうかに関係なく、finally ステートメント内のコードが実行されます。サンプルコードは次のとおりです。

 <!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>JavaScript</title>
</head>
<body>
    <script>
        // ユーザーの入力パラメータを受け取る
        var num = prompt("0から100までの数字を入力してください。");
        // 現在の時間を取得します。
        var start = Date.now();
        try {
            if(num > 0 && num <= 100) {
                console.log(Math.pow(num, num)); // 基数の指数
            } else {
                console.log("入力された値が無効です。");
            }
        } catch(e) {
            console.log(e.message);
        } finally {
            // コードの実行にかかった時間を表示します。
            console.log("コードの実行にかかった時間は" + (Date.now() - start) + "ミリ秒です。");
        }
    </script>
</body>
</html> 

88 などの 100 未満の数値を入力すると、実行結果は次のようになります。

1.3015928349429721e+171
コードの実行にかかった時間: 0ms

123 など、100 より大きい数値を入力すると、実行結果は次のようになります。

入力された値は無効です!
コードの実行にかかった時間: 0ms

JS がエラーをスローする

JavaScript では、JavaScript パーサーを使用してエラーを自動的にスローするだけでなく、エラーを手動でスローすることもできます。エラーをスローするには、throw ステートメントを使用する必要があります。構文は次のとおりです。

式をスローします。

ここで、expression はスローされる例外であり、オブジェクト、文字列、配列など、任意の型の値にすることができます。オブジェクト型を使用することをお勧めします。

JavaScript には、スローされるエラー オブジェクトを作成する組み込みの Error() 関数があります。サンプル コードは次のとおりです。

 <!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>JavaScript</title>
</head>
<body>
    <script>
        function squareRoot(number) {
            // 数字が負の場合はエラーを投げる
            if(number < 0) {
                throw new Error("申し訳ありませんが、負数の平方根は計算できません!");
            } else {
                console.log(Math.sqrt(number));
            }
        }
        try {
            squareRoot(16);
            squareRoot(625);
            squareRoot(-9);
            squareRoot(100);
            // エラーが投げられた場合、以下の行は実行されない
            console.log("すべての関数が正常に実行されました。");
        } catch(e) {
            // エラーを処理する
            console.log(e.message);
        }
    </script>
</body>
</html> 

操作の結果は次のとおりです。

4
25
申し訳ありませんが、負の数の平方根は計算できません!

JS エラータイプ

前に、try ステートメント ブロックのコードでエラーが発生すると、Error オブジェクトが作成されてスローされることを説明しました。このオブジェクトには、エラーの種類とエラーの説明という 2 つの属性が含まれます。

When different errors occur, different error types will be returned. JavaScript は、次のエラーの種類をサポートしています。

エラータイプ 例証する
EvalError eval() 関数の使用時にエラーが発生すると、このエラーがスローされます
InternalError JavaScript エンジンの内部エラーが原因で発生した例外。このエラーがスローされます
RangeError 許容範囲外の値が使用された場合にスローされる RangeError
SyntaxError コードに構文エラーがある場合にスローされる構文エラー
TypeError TypeError は、数値に対して文字列メソッドを呼び出したり、文字列に対して配列メソッドを呼び出したりするなど、予期される型ではない値が使用されたときにスローされます。
URIError URI エラー。URI 関連の関数を使用して URI パラメータを渡すと、このエラーがスローされます
ReferenceError パラメータ エラー。未定義の変数、関数、オブジェクトを使用しようとすると、このエラーがスローされます

 

 

「 JS try catch の使用法: 例外処理」についてわかりやすく解説!絶対に観るべきベスト2動画

【JavaScript入門】#10 例外処理「try, catch」についてわかりやすく解説!【オブジェクト編】
【超重要】try catch 今すぐ使おう【kintone JavaScriptカスタマイズ】TeruMe