Promise-延期された非同期計算

@serverSerrverlesskiy

Promiseは、非同期操作の将来価値を含むオブジェクトです。たとえば、サーバーにデータを要求した場合、Promiseはこのデータを取得することを約束します。これは、将来使用できます。

math

最初、プロミスのステータスは「保留中」（「待機中」）です。次に、「達成済み」（「正常に完了」）または「拒否」（「エラーで完了」）のいずれかです。

promise states

保留中-結果の準備ができていない場合、約束は保留中です。つまり、何かが完了するのを待ちます（たとえば、非同期操作が完了するのを待ちます）。
Fulfilled-結果が利用可能であれば、約束は解決されます。つまり、何かが実行を完了し（たとえば、非同期操作）、すべてが成功しました。
Rejected-実行中にエラーが発生した場合、Promisは拒否されました。

約束の作成

Plus

Promiseオブジェクトは、キーワード🗝️newとそのコンストラクターを使用して作成されます。 Promiseコンストラクターは1つの引数、コールバック（エグゼキューター関数⚙️とも呼ばれます）を取ります。これは、resolveとrejectの2つのコールバックを取ります。

実行機能⚙️は、promiseが作成された直後に実行されます。約束はresolve（）の呼び出しで実行され、 reject（）で拒否されます。

const promise = new Promise((resolve, reject) => {
  if (allWentWell) {
    resolve('すべてが完璧に進みました！')
  } else {
    reject('何かがうまくいかなかった')
  }
})

resolve（）と reject（）は、文字列、数値、ブール値、配列、またはオブジェクトの1つの引数を取ります。

関数⚙️にpromiseの機能⚙️を提供するには、その中にPromiseオブジェクトを返す必要があります。

function myAsyncFunction(url) {
  return new Promise((resolve, reject) => {
    // 機能コード
  })
}

約束を使う

Help

Promiseは、 then（）および catch（）メソッドで使用されます。

then

thenメソッドは、正と負のpromise結果に対して関数⚙️を実行するために使用されます。

Launch

thenメソッドの構文：

promise.then(
  function (result) {
    /* 成功を処理する */
  },
  function (error) {
    /* エラーを処理します */
  }
)

thenメソッドの最初の1️⃣引数は、promiseが「成功」状態になり、結果を取得するときに実行される関数⚙️です。

2番目の引数thenは、promiseが"failed"状態になり、エラーを受け取ったときに実行される関数⚙️です。

Error

thenメソッドの例：

let promise = new Promise(function (resolve, reject) {
  setTimeout(() => resolve('done!'), 1000)
})

// resolveは、.thenに渡された最初の関数を実行します
promise.then(
  result => alert(result), //「done！」と出力されます 1秒で
  error => alert(error) // 起動しません
)

そして、約束にエラーがあった場合、2番目のものが実行されます：

let promise = new Promise(function (resolve, reject) {
  setTimeout(() => reject(new Error('Whoops!')), 1000)
})

// 拒否すると、.thenに渡された2番目の関数が実行されます
promise.then(
  result => alert(result), // 起動しません
  error => alert(error) // 「エラー：おっと！」を出力します 1秒後
)

正常に実行された結果のみを表示する必要がある場合は、1つの関数のみをthen⚙️に渡すことができます。

let promise = new Promise(resolve => {
  setTimeout(() => resolve('done!'), 1000)
})

promise.then(alert) // 「done！」と出力されます 1秒後

catch

Catch

catchメソッドはエラーをキャッチするために使用されます。 thenメソッドの代わりに、エラーに関するエラーメッセージを表示するために使用できます。

catchメソッドの構文：

let promise = new Promise((resolve, reject) => {
  setTimeout(() => reject(new Error('Ошибка!')), 1000)
})

promise.catch(alert) // 「エラー：エラー！」を鳴します1秒後

promise.all

このメソッドは、promiseの配列を受け取り、新しいpromiseを返します。この新しいpromiseは、拒否されたpromiseが満たされるとすぐに、配列内のすべてのpromiseが実行または拒否されたときに実行されます。

Return

例えば：

const promise1 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise1 выполнен')
  }, 2000)
})
const promise2 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise2 выполнен')
  }, 1500)
})
Promise.all([promise1, promise2])
  .then(data => console.log(data[0], data[1]))
  .catch(error => console.log(error))