広告スペース(バナー)
🟨JavaScript レッスン
基本文法の基礎8
データ構造とオブジェクト指向8
構文の基本を深める9
関数とデータ構造の応用9
アルゴリズムとテストの基礎8
文字列・数値操作の応用8
実務で役立つ機能8
アルゴリズム練習問題10
レッスン 11 / 69

エラー処理(try...catch)

このレッスンでは、JavaScriptのtry...catchによるエラー処理を学び、想定外の不具合が起きてもプログラム全体を止めずに動かし続けられるようになることを目標にします。「JavaScript try catch 使い方」「JavaScript エラー処理」で調べている方向けです。

プログラム実行中に問題が起きる(エラーが発生する)ことがあります。tryブロックの中でエラーが起きても、catch (エラー) { 処理 }ブロックで受け止めて、プログラム全体が止まらないようにできます。「万が一失敗しても、代わりの行動をあらかじめ決めておく」という保険のような仕組みです。throw new Error(メッセージ)で自分から意図的にエラーを発生させることもできます。

サンプルコードではdivide関数の中で、0で割ろうとした場合にthrowでエラーを発生させています。tryブロックの中でdivide(10, 0)を呼び出すとエラーが投げられ、catchブロックがそれを受け止めてerror.message(エラーメッセージ)を表示しています。エラーが起きた時点でtryブロックの残りの処理はスキップされる点も重要です。

初心者がよくつまずくのが、tryブロックの外で発生したエラーはcatchで受け止められない点です。エラーが起きる可能性のある処理を、きちんとtryの中に収める必要があります。また、エラーをcatchしたのに何も処理を書かず握りつぶしてしまうと、不具合の原因が分からなくなるため避けましょう。

実際の開発現場では、ユーザーの入力ミスやネットワーク障害、外部APIの応答エラーなど、予測できないトラブルは必ず起こります。適切なエラー処理は、ユーザーにエラー画面を見せず適切なメッセージを表示するためにも、安定して動くアプリを作るための欠かせないスキルです。

catchブロックでは、エラーオブジェクトの.messageだけでなく.name(エラーの種類)も参照でき、エラーの種類によって異なる対応を行うことも可能です。想定されるエラーの種類をあらかじめ整理しておくと、より丁寧なエラー処理を書けます。

意図的にエラーを発生させたいときはthrow new Error("メッセージ")のように書きます。Error以外にもTypeErrorRangeErrorといった、エラーの種類に応じたクラスも用意されており、より詳細なエラー分類が可能です。

JavaScript
OUTPUT / 実行結果

💡 console.log() の内容が実行結果に表示されます。

🎯
ここまでできればゴール達成!
0で割ろうとしてもクラッシュしない、安全な電卓プログラムが作れるようになります。
広告スペース(バナー)
広告スペース(記事内)