【JavaScript】APIのエラーハンドリングをより良く書きたい。

当初の書き方

APIと通信を行い、ステータスコードでエラー画面を表示したり、
成功のトーストを表示したりなどをする状況で、

「エラー処理は try-catch だな...」と思っていた自分は
当初は以下のように書いておりました。

let response

try {
  // API通信
  response = await this.$api.post({ ... })
} catch (error) {
  response = error.response
}

if (response.status === 201) {
  // 成功時の処理
} else {
  // 失敗時の処理
}

この書き方でも問題は無いのですが、
letを使うのはちょっと...という感じがしてしまいます。

改善

そこで、API通信が非同期処理であり、戻り値はPromiseであることに着目すると、
以下のように書き換えられます。

const response = await this.$api.post({ ... }).catch((error) => {
  return error.response
})

if (response.status === 201) {
  // 成功時の処理
} else {
  // 失敗時の処理
}

これでletを使わずに書くことができて、より良いコードになりました。
（ちなみにPromiseについてはこちらのサイトで勉強したのですが、すごく良かったです。）