fetch()でエラーを処理する - JavaScriptのチュートリアル

このレッスンでは、fetch を使って エラーの処理をしてみたいと思います。 今開いているコードなんですが、 この関数ですね。 fetch を使っています。 けれどもエラーの処理は行われていません。 url が渡されて、関数にですね。 この関数に渡されて そしてそれを fetch に渡すと promise が返されるので 返された promise に対して 関数を渡していますが、 Web APIにリクエストを送って そのレスポンスを得ますので response を得たら その後処理がありますので、またここで Promise を作って返しています。 その中で response に対して json のメソッドを呼び出します。 そうすると promise は返されます。 そうしたらその promise に対して then で 引数に受け取る data は json の解析がなされた JSONのオブジェクトです。 ですからそのJSONのオブジェクトを resolve に渡して、 次の処理に渡すわけですね。 渡された data、 then で data を引き継ぐにとり そうしたらWeb APIから返されたデータが json に解析されて 貴重なデータをプロパティで指定することが できますから、 people というプロパティで 宇宙で働いている人たちのデータを console に出すということやっています。 正常に動いていますので 今の動きを確認しておきましょう。 「Console」には JSONのプロパティ、people から取り出した 3人の宇宙飛行士ですね、 のデータが出力されています。 ですから、うまくいった場合は これで完結です。 でもエラーになる場合があるわけで その処理を加えましょう。 まずはエラーを起こします。 存在しないURLを 渡してしまえばいいですね。 そうすれば そんなのはありません、ということで エラーになります。 確認します。 「Console」にエラーが出ました。 「404 (Not Found)」、 それからクロスドメインですね、 のエラーのほかに fetch もエラーを返していますね。 こんなエラーが fetch から返っています。 この場合のエラーの処理を 加えることにしましょう。 404、謎のエラーは この response…