【JavaScript】Promiseオブジェクトを使った非同期処理

久々に使うことになってほとんど忘れかけていたので、備忘録としてまとめ。
JavaScript で Promise オブジェクトを使った非同期処理の書き方についてです。
現在開発しているプロジェクト内で、データを送信する際に送るデータの一部が壊れるという現象が発生しているため、怪しいところを全部直すところ、非同期処理を実装したほうが良さそうだということで追加しています。

今回参考にさせていただいた記事はこちらから。

【JavaScript】非同期処理/Promise/asyncと聞くとビビっちゃう人を救う – Qiita
https://qiita.com/miyarappo/items/dbe1a9bad36c5e35b623

Promise – JavaScript | MDN
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Promise

プログラムの文法はこちら。

const sample = () => {
  return new Promise((resolve, reject) => {
    // 実行したい処理を記述
    // 正常終了する処理の最後で、resove(); を実行する
    // エラー終了する処理の最後で、reject(); を実行する
  })
}

// 非同期処理関数を呼び出す
sample().then(() => {
    // 正常終了した場合の処理を記述
  }).catch(() => {
    // エラー終了した場合の処理を記述
  });

非同期処理の関数については、下記のように書いてもOKです。

const sample = new Promise(function(resolve, reject) {
  // 実行したい処理を記述
  // 正常終了する処理の最後で、resove(); を実行する
  // エラー終了する処理の最後で、reject(); を実行する
});

sample.then(function() {
    // 正常終了した場合の処理を記述
  }).catch(function(){
    // エラー終了した場合の処理を記述
  });

基本的な書き方は上記のとおりです。
書き方については、特に問題がなければお好きな方をご利用ください。

Qiita の記事によると、async/await と併せて使えば then() や catch() を使わない書き方ができるとのことです。
が、今回は特に複雑な記述にはならなかったので使用していません。
今後もっと処理が複雑化したら導入しようと思います。

以上、JavaScript の Promise オブジェクトで非同期処理を実行する方法でした。
ご参考になれば幸いです。