JavaScript中Promise.all和Promise.race方法的介紹（附代碼）

來源：懂視網責編：小采時間：2020-11-27 19:27:13

JavaScript中Promise.all和Promise.race方法的介紹（附代碼）

JavaScript中Promise.all和Promise.race方法的介紹（附代碼）:本篇文章給大家帶來的內容是關于JavaScript中Promise.all和Promise.race方法的介紹（附代碼），有一定的參考價值，有需要的朋友可以參考一下，希望對你有所幫助。Promise.all() 方法接受一個包含 Promise 對象或普通值的數組(或其它可迭代對象)作為參數

推薦度：

點擊下載本文 文檔為doc格式

導讀JavaScript中Promise.all和Promise.race方法的介紹（附代碼）:本篇文章給大家帶來的內容是關于JavaScript中Promise.all和Promise.race方法的介紹（附代碼），有一定的參考價值，有需要的朋友可以參考一下，希望對你有所幫助。Promise.all() 方法接受一個包含 Promise 對象或普通值的數組(或其它可迭代對象)作為參數

本篇文章給大家帶來的內容是關于JavaScript中Promise.all和Promise.race方法的介紹（附代碼），有一定的參考價值，有需要的朋友可以參考一下，希望對你有所幫助。

Promise.all() 方法接受一個包含 Promise 對象或普通值的數組(或其它可迭代對象)作為參數，并返回一個 Promise。當所有 Promise 對象都 resolve 后，將所有 resolve 值以數組形式作為 Promise.all() resolve 的結果。如果其中之一的 Promise 被 reject，立即以第一個 reject 的值作為 Promise.all() reject 結果。

在實際應用中，如果需要從幾個接口獲取數據，并且要在所有數據到達后才執行某些操作，就可以使用Promise.all()。

const p1 = new Promise(function (resolve) { setTimeout(resolve, 200, 1) })
const p2 = Promise.resolve(2)
const p3 = 3
Promise.all([p1, p2, p3]).then(function (res) { console.log(res) }) // [1,2,3]

以下是代碼實現，需要一個計數器，來確認所有 promise 對象都已經 resolved，之后返回結果。需要一個數組，按順序記錄返回結果。如果使用類似 for (var i = 0; i < iterable[i]; i++) 的方式遍歷，為避免閉包只能傳入變量引用的問題，需要嵌套一層自執行函數。這里使用 for ... in 循環，使函數可以支持除數組外的其它可迭代對象，如數據結構 Set。

const all = function (iterable) {
 return new Promise(function (resolve, reject) {
 let count = 0, ans = new Array(count)
 for (const i in iterable) {
 const v = iterable[i]
 if (typeof v === 'object' && typeof v.then === 'function') {
 v.then(function (res) {
 ans[i] = res
 if (--count === 0) resolve(ans)
 }, reject)
 count++
 } else {
 ans[i] = v
 }
 }
 })
}

const p1 = new Promise(function (resolve) { setTimeout(resolve, 200, 1) })
const p2 = Promise.resolve(2)
const p3 = 3
all([p1, p2, p3]).then(function (res) { console.log(res) }) // [1,2,3]

同 Promise.all()，Promise.race() 方法接受一個包含 Promise 對象或普通值的數組(或其它可迭代對象)作為參數，并返回一個 Promise。一旦其中之一的 Promise 對象 resolve 以后，立即把 resolve 的值作為 Promise.race() resolve 的結果。如果其中之一的對象 reject，Promise.race也會立即 reject。

在實際應用中，如果可以從幾個接口獲取相同的數據，哪個接口數據先到就先用哪個，就可以使用Promise.race()，所需時間等于其中最快的那個接口。下面是代碼：

const race = function (iterable) {
 return new Promise(function (resolve, reject) {
 for (const i in iterable) {
 const v = iterable[i]
 if (typeof v === 'object' && typeof v.then === 'function') {
 v.then(resolve, reject)
 } else {
 resolve(v)
 }
 }
 })
}
const p1 = new Promise(function (resolve) { setTimeout(resolve, 200, 1) })
const p2 = new Promise(function (resolve) { setTimeout(resolve, 100, 2) })
race([p1, p2]).then(function (res) { console.log(res) }) // 2

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

JavaScript中Promise.all和Promise.race方法的介紹（附代碼）

推薦度：

點擊下載本文 文檔為doc格式

標簽：方法介紹 all

熱門焦點

JavaScript中Promise.all和Promise.race方法的介紹（附代碼）

JavaScript中Promise.all和Promise.race方法的介紹（附代碼）

JavaScript中Promise.all和Promise.race方法的介紹（附代碼）

最新推薦

猜你喜歡

熱門推薦