JavaScript Promise all() メソッド

Promise.all() メソッド これは実際には Promise オブジェクト (すべての非同期操作を処理するために使用される JavaScript のオブジェクトでもあります) のメソッドであり、Promise (反復可能) の配列を入力として受け取ります。単一のものが返されます 約束 これは、すべての Promise が反復可能として渡され、解決された場合、または反復可能に Promise が含まれていない場合に解決されます。簡単に言うと、渡された Promise のいずれかが拒否された場合、 Promise.all() このメソッドは、他の Promise が解決されたかどうかに関係なく、すでに拒否された Promise の値を非同期的に拒否します。

構文:

Promise.all( iterable ) 

パラメーター: このメソッドは単一のパラメータを受け取ります 反復可能な これは配列を受け取ります 約束 または、いくつかのオブジェクトを含む通常の配列。

戻り値: 単一の Promise を返すには、いくつかのルールに従います。

  • 渡された引数が空の場合、すでに設定されている Promise を返します。 解決済み
  • 渡された反復可能オブジェクトに Promise が含まれていない場合は、解決された Promise を返します。 非同期的に
  • それ以外の場合はすべて、保留中の Promise を返します。

Promise.all() メソッドの履行と拒否:

履行: 返された約束は果たされ、

  • 渡された反復可能オブジェクトが空の場合、このメソッドはすでに解決された Promise を同期的に返します。
  • 渡された Promise がすべて履行されると、返された Promise は非同期的に履行されます。
  • ここで、この特定のメソッドの実行が成功するかどうかは、実行が成功するためのすべての約束に完全に依存します。

拒絶: 渡された Promise のいずれかが拒否された場合、このメソッドは、他の Promise が解決されたかどうかに関係なく、その Promise の値を拒否します。つまり、いずれかの Promise が実行に失敗した場合、Promise.all() メソッドはエラーを返し、他の Promise が正常に履行されたかどうかは考慮されません。

以下の例は、JavaScript Promise.all() メソッドを示しています。

例 1: Promise.all() メソッドが待機するのは 充実

JavaScript




p1 = Promise.resolve(50);> p2 = 200> p3 => new> Promise(> function> (resolve, reject) {> > setTimeout(resolve, 100,> 'geek'> );> });> Promise.all([p1, p2, p3]).then(> function> (values) {> > console.log(values);> });>

出力

[ 50, 200, 'geek' ] 

例 2: ここで、Promise.all() メソッドは 2000 ミリ秒後に解決され、出力は配列として表示されます。

JavaScript




// Simple promise that resolves> // after a given time> const tOut = (t) =>{> > return> new> Promise((resolve, reject) =>{> > setTimeout(() =>{> > resolve(`Completed> in> ${t}`)> > }, t)> > })> }> // Resolving a normal promise> tOut(1000).then(result =>console.log(結果 +>> ' '> ))> // Completed in 1000> // Promise.all> Promise.all([tOut(1000), tOut(2000)])> > .then(result =>console.log(結果))>>

出力:

Completed in 1000 Completed in 1000, Completed in 2000 

ここ、 Promise.all() Method は維持される Promise の順序です。配列内の最初の Promise は出力配列の最初の要素に解決され、2 番目の Promise は出力配列の 2 番目の要素になります。 等々。

例 3: ここは Promise.all() メソッドはすべての Promise が解決されるまで待機します。

JavaScript




// Simple promise that resolves after a given time> const tOut = (t) =>{> > return> new> Promise((resolve, reject) =>{> > setTimeout(() =>{> > resolve(`Completed> in> ${t}`)> > }, t)> > })> }> // Array contains some time duration> const durations = [1000, 2000, 3000]> const promises = []> // Empty array> durations.map((duration) =>{> > // Calling the async function timeout(), so> > // at this point the async function has started> > // and enters the 'pending' state> > // pushing the pending promise to an array.> > promises.push(tOut(duration))> })> console.log(promises)> // Passing an array of pending promises to Promise.all> // Promise.all will wait till all the promises get resolves> // and then the same gets resolved.> Promise.all(promises).then(response =>console.log(応答))>> // It prints after previous promises gets resolved> // ['Completed in 1000', 'Completed in 2000', 'Completed in 3000']>

出力:

[object Promise], [object Promise], [object Promise] . . . (gap between previous and last promises) . . Completed in 1000, Completed in 2000, Completed in 3000 

例 4: この例に示すように、Promise の 1 つが失敗すると、残りのすべての Promise が失敗し、結果がエラーの形式でコンソールに表示されます。それから Promise.all() メソッドは拒否されます。

JavaScript




// Promise that resolves after a given time> const tOut = (t) =>{> > return> new> Promise((resolve, reject) =>{> > setTimeout(() =>{> > if> (t === 2000) {> > reject(`Rejected> in> ${t}`)> > }> else> {> > resolve(`Completed> in> ${t}`)> > }> > }, t)> > })> }> const durations = [1000, 2000, 3000]> // Array contains some time durations> const promises = []> //empty array> durations.map((duration) =>{> > promises.push(tOut(duration))> > // Pushing durations in the promises array> })> // Passing an array of pending promises to Promise.all> Promise.all(promises).then(response =>console.log(応答))>> > // Promise.all cannot be resolved, as one of the> > // promises passed, got rejected.> > .> catch> (error =>console.log(`::エラー:: ${エラー}`))> // Promise.all throws an error.>

出力:

Error Rejected in 2000 

例-5: この例では、さまざまなタイマーを持つタイマー関数 (特に setTimeout 関数) を使用します。これらのタイマーはさまざまな Promise 内に記述され、さらに、結果を取得するためにそれらの Promise は Promise.all() メソッド内に渡されます。

JavaScript




let first_promise => new> Promise((resolve, reject) =>{> > setTimeout(() =>{> > resolve(> 'Resolved First after 1 second'> );> > }, 1000);> });> let second_promise => new> Promise((resolve, reject) =>{> > setTimeout(() =>{> > resolve(> 'Resolved First after 2 seconds'> );> > }, 2000);> });> let third_promise => new> Promise((resolve, reject) =>{> > setTimeout(() =>{> > resolve(> 'Resolved First after 3 seconds'> );> > }, 3000);> });> try> {> > let result = Promise.all([first_promise, second_promise, third_promise]);> > result.then((data) =>console.log(data));>> }> catch> (error) {> > console.log(error);> }> // This code is contributed by Aman Singla...>

出力:

[  'Resolved First after 1 second',  'Resolved First after 2 seconds',  'Resolved First after 3 seconds' ] 

サポートされているブラウザ:

サポートされているブラウザ JavaScript Promise.all() 方法は以下にリストされています。

  • Google Chrome 32以降
  • エッジ 12 以降
  • Firefox 29 以降
  • Opera 19 以降
  • Safari 8以降
  • Internet Explorerはサポートされていません