這篇文章主要介紹了javascript中Promise.allSettled()怎么用，具有一定借鑒價(jià)值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

創(chuàng)新互聯(lián)不只是一家網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司；我們對(duì)營(yíng)銷、技術(shù)、服務(wù)都有自己獨(dú)特見(jiàn)解，公司采取“創(chuàng)意+綜合+營(yíng)銷”一體化的方式為您提供更專業(yè)的服務(wù)！我們經(jīng)歷的每一步也許不一定是最完美的，但每一步都有值得深思的意義。我們珍視每一份信任，關(guān)注我們的網(wǎng)站制作、做網(wǎng)站質(zhì)量和服務(wù)品質(zhì)，在得到用戶滿意的同時(shí)，也能得到同行業(yè)的專業(yè)認(rèn)可，能夠?yàn)樾袠I(yè)創(chuàng)新發(fā)展助力。未來(lái)將繼續(xù)專注于技術(shù)創(chuàng)新，服務(wù)升級(jí)，滿足企業(yè)一站式營(yíng)銷型網(wǎng)站建設(shè)需求，讓再小的高端網(wǎng)站設(shè)計(jì)也能產(chǎn)生價(jià)值！

Promise.allSettled() 方法返回一個(gè)在所有給定的 promise 都已經(jīng) fulfilled 或 rejected 后的 promise，并帶有一個(gè)對(duì)象數(shù)組，每個(gè)對(duì)象表示對(duì)應(yīng)的 promise 結(jié)果。

接著，我們來(lái)看看 Promise.allSettled() 是如何工作的。

1. Promise.allSettled()

Promise.allSettled() 可用于并行執(zhí)行獨(dú)立的異步操作，并收集這些操作的結(jié)果。

該函數(shù)接受一個(gè) promise 數(shù)組(通常是一個(gè)可迭代對(duì)象)作為參數(shù):

const statusesPromise = Promise.allSettled(promises);

當(dāng)所有的輸入 promises 都被 fulfilled 或 rejected 時(shí)，statusesPromise 會(huì)解析為一個(gè)具有它們狀態(tài)的數(shù)組

• { status: 'fulfilled', value: value } — 如果對(duì)應(yīng)的 promise 已經(jīng) fulfilled

• 或者 {status: 'rejected'， reason: reason} 如果相應(yīng)的 promise 已經(jīng)被 rejected

在解析所有 promises 之后，可以使用 then 語(yǔ)法提取它們的狀態(tài):

statusesPromise.then(statuses => {
 statuses; // [{ status: '...', value: '...' }, ...]
});

或者使用 async/await 語(yǔ)法：

const statuses = await statusesPromise;
statuses; // [{ status: '...', value: '...' }, ...]

2. 取水果和蔬菜

在深入研究 Promise.allSettle() 之前，我們先定義兩個(gè)簡(jiǎn)單的 helper 函數(shù)。

首先，resolveTimeout(value, delay)返回一個(gè) promise ，該 promise 在經(jīng)過(guò) delay 時(shí)間后用 value 來(lái)實(shí)現(xiàn)

function resolveTimeout(value, delay) {
  return new Promise(
    resolve => setTimeout(() => resolve(value), delay)
  );
}

第二，rejectTimeout(reason, delay) - 返回一個(gè) promise，在經(jīng)過(guò) delay 時(shí)間后拒絕reason。

最后，我們使用這些輔助函數(shù)來(lái)試驗(yàn) promise.allsettle()。

2.1 All promises fulfilled

我們同時(shí)訪問(wèn)當(dāng)?shù)仉s貨店的蔬菜和水果。訪問(wèn)每個(gè)列表是一個(gè)異步操作:

const statusesPromise = Promise.allSettled([
  resolveTimeout(['potatoes', 'tomatoes'], 1000),
  resolveTimeout(['oranges', 'apples'], 1000)
]);
// wait...
const statuses = await statusesPromise;
// after 1 second
console.log(statuses); 
// [
//   { status: 'fulfilled', value: ['potatoes', 'tomatoes'] },
//   { status: 'fulfilled', value: ['oranges', 'apples'] }
// ]

線上事例：https://codesandbox.io/s/all-resolved-yyc0l?file=/src/index.js

Promise.allSettled([...])返回一個(gè) promise  statusesPromise，該 promise 在1秒內(nèi)解決，就在蔬菜和水果被解決之后，并行地解決。

statusesPromise 解析為一個(gè)包含狀態(tài)的數(shù)組。

• 數(shù)組的第一項(xiàng)包含有蔬菜的已完成狀態(tài):status: 'fulfilled', value: ['potatoes', 'tomatoes'] }

• 同樣的方式，第二項(xiàng)是水果的完成狀態(tài): { status: 'fulfilled', value: ['oranges', 'apples'] }

2.2一個(gè) promise 被拒絕

想象一下，在雜貨店里已經(jīng)沒(méi)有水果了。在這種情況下，我們拒絕水果的 promise。

promise.allsettle() 在這種情況下如何工作?

const statusesPromise = Promise.allSettled([
  resolveTimeout(['potatoes', 'tomatoes'], 1000),
  rejectTimeout(new Error('Out of fruits!'), 1000)
]);
// wait...
const statuses = await statusesPromise;
// after 1 second
console.log(statuses); 
// [
//   { status: 'fulfilled', value: ['potatoes', 'tomatoes'] },
//   { status: 'rejected', reason: Error('Out of fruits!') }
// ]

線上事例：https://codesandbox.io/s/one-rejected-ij3uo?file=/src/index.js

Promise.allSettled([...]) 返回的 promise 在 1 秒后解析為一個(gè)狀態(tài)數(shù)組:

• 數(shù)組的第一項(xiàng)，蔬菜 promise 成功解析：{ status: 'fulfilled', value: ['potatoes', 'tomatoes'] }

• 第二項(xiàng)，因?yàn)樗?promise  被拒絕，所以是一個(gè)拒絕狀態(tài): { status: 'rejected', reason: Error('Out of fruits') }

即使輸入數(shù)組中的第二個(gè) promise  被拒絕，statusesPromise仍然會(huì)成功解析一個(gè)狀態(tài)數(shù)組。

2.3 所有的 promises 都被 rejected

如果雜貨店里的蔬菜和水果都賣光了怎么辦？在這種情況下，兩個(gè) promise 都會(huì)被拒絕。

const statusesPromise = Promise.allSettled([
  rejectTimeout(new Error('Out of vegetables!'), 1000),
  rejectTimeout(new Error('Out of fruits!'), 1000)
]);
// wait...
const statuses = await statusesPromise;
// after 1 second
console.log(statuses); 
// [
//   { status: 'rejected', reason: Error('Out of vegetables!')  },
//   { status: 'rejected', reason: Error('Out of fruits!') }
// ]

線上事例：https://codesandbox.io/s/all-rejected-z4jee?file=/src/index.js

在這種情況下，statusesPromise仍然成功地解析為一個(gè)狀態(tài)數(shù)組。然而，該數(shù)組包含被拒絕的promise 的狀態(tài)。

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享的“javascript中Promise.allSettled()怎么用”這篇文章對(duì)大家有幫助，同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)，關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，更多相關(guān)知識(shí)等著你來(lái)學(xué)習(xí)!

網(wǎng)頁(yè)題目：javascript中Promise.allSettled()怎么用
文章起源：http://aaarwkj.com/article36/jjpspg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供面包屑導(dǎo)航、自適應(yīng)網(wǎng)站、云服務(wù)器、小程序開(kāi)發(fā)、品牌網(wǎng)站設(shè)計(jì)、

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)