如何在JavaScript中使用Promise.allSettled()
你編寫了一些基于 Promise 的代碼,一切都進(jìn)展順利,然后繁榮——一個(gè)小小的 Promise 被拒絕,整個(gè)鏈條就會(huì)崩潰。
你的代碼逐漸停止,你想知道為什么 JavaScript 不能忽略這個(gè)小問題并繼續(xù)它的快樂之路。好吧,朋友,我有好消息要告訴你嗎?
來認(rèn)識(shí)一下Promise.allSettled(),你的新最好的朋友和你從來不知道自己需要的承諾。Promise.allSettled()是一個(gè)游戲規(guī)則改變者,讓您等待所有承諾得到解決(解決或拒絕),然后根據(jù)結(jié)果采取行動(dòng)。
不再有被破壞的承諾鏈或未處理的拒絕。只是純粹、純粹的幸福承諾。和我一起深入研究這個(gè)鮮為人知但非常有用的 Promise 方法,看看它能在多大程度上簡(jiǎn)化你的異步 JavaScript代碼。
(更|多優(yōu)質(zhì)內(nèi)|容:java567 點(diǎn) c0m)
什么是 Promise.allSettled()?
您想要使用 JavaScript 的 Promise.allSettled() 方法,但不太確定它是如何工作的或者為什么要使用它?不用擔(dān)心,我已經(jīng)為您提供了保障。
Promise.allSettled()等待你給它的所有承諾得到解決,意味著解決或拒絕。然后,它返回一個(gè)對(duì)象數(shù)組,其中包含每個(gè)承諾的狀態(tài)和值或原因。
當(dāng)您希望確保已完成多個(gè)異步任務(wù),但不一定關(guān)心其中某些任務(wù)是否失敗時(shí),這非常有用。
例如,假設(shè)您有三個(gè)返回 Promise 的 API 調(diào)用,并且您希望從成功的調(diào)用中獲取所有數(shù)據(jù),即使其中一個(gè)調(diào)用失敗。你可以這樣做:
?Promise.allSettled([apiCall1(), apiCall2(), apiCall3()]).then((results) => {});
這將運(yùn)行所有三個(gè) API 調(diào)用,并且.then()在它們?nèi)拷鉀Q后將調(diào)用回調(diào)。結(jié)果數(shù)組將包含三個(gè)對(duì)象:每個(gè)承諾一個(gè),其狀態(tài)為“已完成”和數(shù)據(jù),或者“已拒絕”和錯(cuò)誤。
我們可以過濾以獲取成功的調(diào)用,然后繼續(xù)使用該數(shù)據(jù)。
要記住的關(guān)鍵事項(xiàng)是:
Promise.allSettled()等待所有輸入承諾解決并返回其結(jié)果。
已解決意味著已解決(已實(shí)現(xiàn))或已拒絕。
它返回一個(gè)對(duì)象數(shù)組,其中包含每個(gè)輸入承諾的狀態(tài)和值/原因。
即使有人拒絕,它也允許處理成功的承諾。
問題與Promise.all()解決方案Promise.allSettled()
Promise.all()當(dāng)您想要等待多個(gè) Promise 完成并獲取所有已解析值的數(shù)組時(shí),這非常有用。但它有一個(gè)主要缺點(diǎn):如果任何一個(gè)承諾被拒絕,整個(gè)Promise.all()承諾都會(huì)立即被拒絕。
在某些情況下這可能會(huì)出現(xiàn)問題。例如,假設(shè)您向三個(gè)不同的后端服務(wù)發(fā)出請(qǐng)求,只要其他兩個(gè)服務(wù)成功,您并不真正關(guān)心其中一個(gè)是否失敗。使用 時(shí)Promise.all(),單個(gè)被拒絕的 Promise 將拒絕整個(gè)組,并且您會(huì)錯(cuò)過其他 Promise 的成功響應(yīng)。
幸運(yùn)的是,有一個(gè)簡(jiǎn)單的解決方案:Promise.allSettled()。其工作原理與此類似,Promise.all()但如果任何 Promise 拒絕,它不會(huì)立即拒絕,而是等待所有 Promise 解決(解決或拒絕),然后返回一個(gè)對(duì)象數(shù)組,其中包含每個(gè) Promise 的狀態(tài)和值/原因。
例如:
?Promise.allSettled([
? ?Promise.resolve(1),
? ?Promise.reject(new Error("2")),
? ?Promise.resolve(3),
?]).then((results) => {
? ?// results is an array of:
? ?// {status: "fulfilled", value: 1}
? ?// {status: "rejected", reason: Error}
? ?// {status: "fulfilled", value: 3}
?});
正如您所看到的,即使第二個(gè)承諾被拒絕,我們?nèi)匀粡钠渌兄Z中獲得解析值。這使您能夠優(yōu)雅地處理拒絕,而不會(huì)錯(cuò)過任何成功的回復(fù)。
Promise.allSettled()在這些類型的情況下提供了更大的靈活性。您可以全面了解所有承諾,無論是否有一些拒絕,因此您仍然有機(jī)會(huì)利用任何已解決的值并適當(dāng)處理拒絕。
因此,下次當(dāng)您需要等待多個(gè) Promise 但又不能因?yàn)榫芙^而錯(cuò)過任何已解決的值時(shí),請(qǐng)務(wù)必使用Promise.allSettled()!這是對(duì)Promise API 的一個(gè)非常有用的補(bǔ)充。
常見問題Promise.allSettled()
會(huì)Promise.allSettled()減慢我的代碼速度嗎?
并不真地。Promise.allSettled()只需等待您傳遞給它的所有承諾通過履行或拒絕來解決。它不會(huì)做任何其他會(huì)影響性能的事情。
我還能發(fā)現(xiàn)錯(cuò)誤嗎Promise.allSettled()?
是的,你絕對(duì)可以!Promise.allSettled()將為您提供每個(gè)承諾的結(jié)果,無論是履行還是拒絕。
對(duì)于任何被拒絕的 Promise,您都會(huì)得到拒絕的原因,通常是錯(cuò)誤。.catch()您可以在調(diào)用的處理程序中捕獲這些錯(cuò)誤Promise.allSettled()。
我什么時(shí)候應(yīng)該使用Promise.allSettled()vs Promise.all()?
Promise.allSettled()當(dāng)您想要并行運(yùn)行多個(gè) Promise,但不希望單個(gè)被拒絕的 Promise 導(dǎo)致整個(gè)組拒絕時(shí)使用。
例如,如果您從多個(gè)第三方 API 獲取數(shù)據(jù),則一個(gè) API 被拒絕的承諾不應(yīng)阻止您從其他 API 獲取數(shù)據(jù)。
Promise.all()當(dāng)您想要并行運(yùn)行 Promise 但需要它們?nèi)砍晒ν瓿刹拍苁勾a繼續(xù)運(yùn)行時(shí),請(qǐng)使用。
例如,如果您需要從兩個(gè) API 獲取數(shù)據(jù)以在頁(yè)面上顯示,則您希望在呈現(xiàn)數(shù)據(jù)之前滿足這兩個(gè)承諾。
我能得到已達(dá)成的承諾的結(jié)果嗎?
是的!Promise.allSettled()返回一個(gè)對(duì)象數(shù)組,其中包含每個(gè)承諾的狀態(tài)和值/原因。例如:
?Promise.allSettled([
? ?Promise.resolve(1),
? ?Promise.reject(new Error("2")),
? ?Promise.resolve(3),
?]).then((results) => {
? ?console.log(results);
? ?/*
? ? ?[
? ? ? ?{ status: "fulfilled", value: 1 },
? ? ? ?{ status: "rejected", reason: Error: 2 },
? ? ? ?{ status: "fulfilled", value: 3 }
? ? ?]
? ? ?*/
?});
您將獲得有關(guān)所有承諾的信息,無論它們是履行還是拒絕,因此您可以全面了解并行操作。
結(jié)論
所以你有它。Promise.allSettled()這是一種你從來不知道自己需要的便捷方法。
您不再需要僅用Promise.all()try/catch 來處理潛在的拒絕。您可以讓我們Promise.allSettled()為您處理所有這些事情,而只關(guān)注已解決的值。您的異步代碼將更加干凈且易于閱讀。