JavaScriptのtry~catch文で例外処理をする方法

プログラミング
try~catch文はJavaScriptにおける例外処理が記述できます。例外処理とは何なのか?どのような場面で使うのか?といった基本の知識から、実際の記述方法などについて、コードの実例とともに例外処理を初めて学習する初心者にもわかりやすいように解説していきます。
JavaScriptのtry~catch文で例外処理をする方法

プログラムを実行する際にエラー(例外)が起こることがあります。通常はエラーが起こった際、そこでプログラムは止まります。しかし、実際の場面ではエラーが起こってもプログラムに止まって欲しくない場合もあります。そんな時に使えるのがtry~catch文です。

今回はJavaScriptでの例外処理に利用されるtry~catch文について、概要や使い方、デバッグに使用する方法などについて解説していきます。

JavaScriptで例外処理をおこなうtry~catch文とは


try~catch文を使うことで、例外処理を記述できます。 例外処理とは、予期していない異常によりエラー(例外)が発生する場面で意図的にエラーを回避することです。 例外処理を記述することで、例外の発生場面でもプログラムをストップさせずに別の処理を実行させることができます。

JavaScriptのtry~catch文の書き方


それではJavaScriptにおけるtry~catch文の書き方を解説していきます。

try~catch文は以下のように記述します。

try{
    //例外が発生する可能性のある処理
}catch(e){
    //例外が発生した場合の処理
}

tryブロック内に例外の発生する可能性がある処理を記述し、例外が発生した場合にはcatchブロック内の処理が実行されます。 catchブロックの引数にはErrorオブジェクトが渡されます。(Errorオブジェクトについては後述します。)

では、try~catch文を実際に書いてみます。

try {
    var greeting = "こんにちは、" + name + "です。";
    console.log( greeting );
} catch(e) {
    console.log( e.message );
}

このコードの実行結果は以下の通りです。

name is not defined

このコードを実行すると、変数nameが定義されていないという例外が発生します。通常はそこで処理が終了してしまいますが、try~catch文を記述していることでcatchブロック内の処理が実行されます。Errorオブジェクトのmessageプロパティを使うとエラーメッセージを取得できます。

throw文で例外を発生させる

throw文を使うことで、オリジナルの例外を定義することができます。例えば、以下のコードを見てください。

var num = "RED";

try {
    if(num.search(/^[-]?[0-9]+$/) === -1){
        throw new Error('変数numには整数を入れてください')
    } 
    var like = "好きな数字は、" + num + "です。";
    console.log( like );
} catch(e) {
    console.error( "エラー:", e.message );
}

このコードでは、変数numに数値以外の値が入っている場合にthrow文を使って例外を発生させています。

throw文で文字通りcatchブロックにErrorオブジェクトを投げているのです。throw文が実行されると即座にcatchブロックの処理に移ります。Errorオブジェクトのコンストラクタにはエラーメッセージを持たせることも可能です。

Errorオブジェクトとは

Errorオブジェクトはエラー情報を出力する際に使われるオブジェクトで、エラーの種類によっていくつかのオブジェクトが用意されています。

代表的なものをいくつか紹介します。

  • Error 一般的なエラー全般
  • RangeError 数値が有効範囲外の場合のエラー
  • ReferenceError 宣言されていない変数のエラー
  • SyntaxError 文法エラー
  • TypeError 想定されたデータ型でない場合のエラー

throw文などで例外の種類によってオブジェクトを使い分けると、どのようなエラーが起こったかがわかりやすくなりデバッグにも便利です。

以下のコードでは2種類のthrow文でそれぞれ別のErrorオブジェクトを投げています。

var num = "14";
try {
    if(num.search(/^[-]?[0-9]+$/) === -1){
        throw new TypeError('変数numには整数を入れてください')
    }
    if(num > 12){
        throw new RangeError('変数numには12以下の整数を入れてください')
    }
    var birthday = "誕生日は" + num + "月です。";
    console.log( birthday );
} catch(e) {
    console.error( e.name, e.message );
}

finally文で例外発生後の処理を記述する

try~catch文では、例外が発生した場合には即座にcatchブロックの例外処理に移るため、例外発生個所以降の通常処理は実行されません。例えば、メモリの開放処理やデータベースのコネクション解除処理などといった、例外の発生の有無にかかわらず必ず実行させたい処理がある場合にはfinally文を使用します。

finally文は以下のように記述します。

    try {
        //例外が発生した場合の処理
    } catch (e) {
     //例外が発生した場合の処理
    } finally {
         //必ず実行される処理
    }

finallyブロック内に記述した処理は例外発生の有無にかかわらず必ず実行されます。

try~catchをデバッグに使う


Errorオブジェクトの項でも少し触れましたが、try~catch文はデバッグの際にとても有用です。Errorオブジェクトにはエラー発生個所の特定などに使えるプロパティが用意されています。

stackプロパティでエラー発生個所を見つける

Errorオブジェクトのstackプロパティを使うことで例外が発生した関数と行番号などの詳細が出力されます。

以下のコードを実行してみると、関数birthdayShowで例外が発生したことがわかります。

var num = "14";
try {
    birthdayShow(num);
 } catch(e) {
    console.error( e.stack);
}

function birthdayShow(month){
        if(month.search(/^[-]?[0-9]+$/) === -1){
        throw new TypeError('変数numには整数を入れてください')
    }
    if(month > 12){
        throw new RangeError('変数numには12以下の整数を入れてください')
    }
     var birthday = "誕生日は" + month + "月です。";
    console.log( birthday );
}

まとめ

今回はJavaScriptにおける例外処理であるtry~catch文について解説してきました。ここまでのポイントをまとめると以下の通りです。

  • try~catch文を書くことでエラー発生時にも処理がストップしない
  • tryブロック内に通常処理、catchブロック内に例外処理を記述
  • throw文でユーザー定義の例外処理を記述可能
  • finally文で必ず実行される処理を記述可能
  • try~catch文で効率的にデバッグをしよう

例外処理を使いこなしてJavaScriptのプログラムをさらに効率的に書いていきましょう。

この記事のキーワードに関する勉強会・イベントを探す

TECH PLAYでは、ITエンジニア向けの勉強会・イベント情報を提供しています。
興味のある方はぜひご参加ください。


おすすめのコラム