try...catchの使い方 - あさめしコード

制御構文とは

制御構文（Control structures）は、プログラムの実行フローを制御するための構文や文の集まりです。プログラムは通常、順次実行されるため、制御構文を使用することで条件に応じて処理を分岐させたり、ループを実行したりすることができます。

一般的な制御構文には以下のようなものがあります：

条件分岐：
- if 文: 指定された条件が真である場合に、特定のコードブロックを実行します。
- else if 文: if 文に対して、さらなる条件を追加します。
- else 文: いずれの条件も満たさなかった場合に実行されるコードブロックを指定します。
- 三項演算子: 簡潔な条件分岐を行うための演算子です。
繰り返し処理（ループ）：
- for ループ: 指定された回数だけコードブロックを繰り返し実行します。
- while ループ: 指定された条件が真である場合に、コードブロックを繰り返し実行します。
- do-while ループ: コードブロックを実行した後に条件を評価し、条件が真である場合は繰り返し実行します。
制御フローの変更：
- break 文: ループやスイッチ文からの脱出を行います。
- continue 文: ループ内の現在のイテレーションをスキップし、次のイテレーションに進みます。
- return 文: 関数からの脱出と値の返却を行います。

これらの制御構文を使用することで、プログラムの実行フローを柔軟に制御し、条件に応じた処理や反復処理を行うことができます。制御構文は、プログラムの構造化と効率的な実行を実現するために重要な役割を果たしています。

`try`と`catch`の使い方

try はメソッドではなく、エラーハンドリングを行うための制御構文です。以下に、try の説明を記載します。

try は JavaScript の try...catch 文によって使用される制御構文です。try ブロック内にはエラーが発生する可能性のあるコードを配置し、エラーが発生した場合には制御が catch ブロックに移行します。try ブロック内のコードが実行され、エラーが発生しなければ catch ブロックはスキップされます。

以下に、基本的な try...catch 文の構文を示します。

try {
  // エラーが発生する可能性のあるコード
} catch (error) {
  // エラーハンドリングを行うコード
}

try ブロック内のコードが実行され、エラーが発生しない場合は、catch ブロックはスキップされます。エラーが発生した場合、例外オブジェクトが catch ブロックに渡され、エラーハンドリングが行われます。

try...catch 文を使用することで、予期せぬエラーに対する適切な処理やエラーメッセージの表示、代替処理の実行などが可能となります。ただし、try...catch 文は例外処理のためのメカニズムであり、パフォーマンスの面でコストがかかる場合があるため、必要な場所で適切に使用することが重要です。

try…catchの例

以下に、try...catch 文を使用したエラーハンドリングの例を示します。

function divide(a, b) {
  try {
    if (b === 0) {
      throw new Error("除数は0であってはなりません。");
    }
    const result = a / b;
    console.log("結果:", result);
  } catch (error) {
    console.error("エラーが発生しました:", error.message);
  }
}

divide(10, 2); // 結果: 5
divide(10, 0); // エラーが発生しました: 除数は0であってはなりません。

この例では、divide 関数内で引数 b が 0 の場合に例外をスローしています。try ブロック内のコードが実行され、例外がスローされると、制御は catch ブロックに移行し、エラーメッセージが表示されます。

try ブロック内でエラーが発生しない場合は、catch ブロックはスキップされます。

try...catch 文を使用することで、プログラムの実行中にエラーが発生しても、エラーメッセージを表示して処理を継続することができます。

`try...catch` 文と `fetch()`

以下に、try...catch 文と fetch() を使用したAPIリクエストの例を示します。実際に利用できるAPIを使って、JSONPlaceholderの/postsエンドポイントを使用します。

async function fetchData() {
  try {
    const response = await fetch('https://jsonplaceholder.typicode.com/posts');
    if (!response.ok) {
      throw new Error('APIリクエストが失敗しました。');
    }
    const data = await response.json();
    console.log('レスポンス:', data);
  } catch (error) {
    console.error('エラーが発生しました:', error.message);
  }
}

fetchData();

この例では、fetch() メソッドを使用してJSONPlaceholderのAPIからデータを取得しています。try ブロック内では、fetch() メソッドを呼び出してAPIリクエストを行い、レスポンスのステータスを確認しています。レスポンスが正常でない場合、throw ステートメントを使用して例外をスローします。

正常なレスポンスの場合は、response.json() メソッドを使用してレスポンスのデータをJSON形式で取得し、それをログに表示します。

エラーが発生した場合、制御は catch ブロックに移行し、エラーメッセージが表示されます。

ご利用いただけるAPIがあれば、そのAPIのエンドポイントを適宜 fetch() の引数として指定して試してみてください。

throw new Error補足：

catch ブロックでは、fetch() メソッド自体がエラーをスローする場合を補足するために使用されます。一方、if (!response.ok) の部分は、レスポンスのステータスコードが成功（2xx 範囲外）であるかどうかを確認するために使用されます。

fetch() メソッドは、ネットワークエラーやサーバーからのエラーレスポンスなど、通信に関連するエラーが発生した場合に Promise を拒否（reject）します。しかし、成功したレスポンス（ステータスコード 2xx）であっても、それが意図したデータの取得に失敗した場合は、それをエラーとして処理する必要があります。

例えば、APIがエラーの詳細情報を含むエラーレスポンスを返した場合、そのレスポンスは ok プロパティが true になる可能性がありますが、それでもエラーとして処理する必要があります。このような場合、if (!response.ok) の条件式により、成功したステータスコードでもレスポンスが成功とはみなされない場合のエラーハンドリングを行うことができます。

したがって、catch ブロックでは通信エラーなどの一般的なエラーを処理し、if (!response.ok) の部分では成功したレスポンスであってもエラーレスポンスをハンドリングするための追加の処理を行うことができます。これにより、さまざまなエラーケースに対して適切な処理を行うことができます。

finallyの使い方

finally ブロックは、try ブロックと catch ブロックの後に続けて使用され、例外が発生したかどうかに関係なく必ず実行されるコードを含めるためのものです。

try ブロック内のコードが実行された後、以下のような場合に finally ブロックが実行されます:

例外がスローされた場合: try ブロック内で例外がスローされると、制御は直ちに関連する catch ブロックに移ります。その後、catch ブロックの処理が完了した後、finally ブロックが実行されます。
例外がスローされなかった場合: try ブロック内のコードが例外をスローしなかった場合でも、finally ブロックはその後に実行されます。

finally ブロックは主にクリーンアップ処理やリソースの解放など、必ず実行しなければならないコードを記述するために使用されます。たとえば、ファイルやデータベースの接続を閉じる、一時的に割り当てたリソースを解放するなどの処理を行うことができます。

以下に、try、catch、finally ブロックを組み合わせた例を示します:

function divide(a, b) {
  try {
    const result = a / b;
    if (isNaN(result)) {
      throw new Error('除算の結果が無効です。');
    }
    return result;
  } catch (error) {
    console.error('エラーが発生しました:', error.message);
    return null;
  } finally {
    console.log('処理が完了しました。');
  }
}

console.log(divide(6, 2));  // 出力: 3
console.log(divide(4, 0));  // エラー: ゼロでの除算

この例では、divide 関数内で try ブロック内での除算が行われます。もし除数がゼロの場合、ゼロでの除算エラーがスローされます。

catch ブロックではエラーが補足され、エラーメッセージがコンソールに表示されます。その後、finally ブロックが実行され、処理が完了したことが示されます。

このように finally ブロックを使用することで、例外の発生の有無に関わらず必ず実行されるコードを提供することができます。

お疲れ様です。

制御構文とは

tryとcatchの使い方

try…catchの例

try...catch 文と fetch()

finallyの使い方

`try`と`catch`の使い方

`try...catch` 文と `fetch()`