【javascript】非同期通信におけるtry/catchでエラーを正しく受け取る方法

try/catchの理解が足りなかったのでおさらいします。今回は非同期通信とtry/catch

を合わせて使ったときにcatchの中身が空っぽだった

try {
if(result.success){
//to something
} else {
//to something
}
} catch (error) {
console.log(error);
console.log(error.message);
}

エラーの際はそのままresultの結果であるerrorをキャッチしてconsole.logで出力してそれをメッセージとして

使いたかったのですが、中を見ると何も入ってない。というかcatchがスルーされたといってもいい

現象がおきました。

どうやらこのtry/catch中にif(result.success)を入れて追加処理をしたのがまずかったみたいです。

try/catchブロックの中でifによる判定が行われる時は、エラーはcatchまで受けわたりません。

tryの前でaxiosで処理を返してるのですが、axios自体が非同期通信のため何らかの処理を挟まない

限りcatch処理であっても無視されてしまいます。

catchにエラーを受け渡すにはthrow new TypeErrorを使います。

try {
if(result.success){
//to something
} else {
throw new TypeError(“エラー”)
} catch (error) {
console.log(error);
console.log(error.message);
}

try/catchと非同期通信を合わせて使う時はthrow new TypeError(“エラー”)でエラーを持たせてあげることが

重要です。これで非同期であってもelseの中で投げられたエラーを持つことで

catchまで行くことができるようになります。