Promise.all
-
原理
將多個(gè)Promise實(shí)例包裝成一個(gè)新的Promise實(shí)例荔泳,成功的時(shí)候返回一個(gè)結(jié)果數(shù)組趟径,失敗的時(shí)候返回最先被reject失敗狀態(tài)的值达址。
-
常見使用場(chǎng)景
頁面上需要等待兩個(gè)或多個(gè)ajax的數(shù)據(jù)回來以后才正常顯示擂橘,在此之前只顯示loading。
用法
let p1 = new Promise((resolve,reject) => {
resolve('成功')
})
let p2 = new Promise((resolve,reject) => {
resolve('success')
})
let p3 = Promise.reject('失敗')
Promise.all([p1,p2]).then((result) => {
console.log(result) // ['成功','seccess']
}).catch((error) => {
console.log(error)
})
Promise.all([p1,p3]).then((result) => {
console.log(result)
}).catch((error) => {
console.log(error)//['失敗']
})
??注意:成功時(shí)接收到的數(shù)組的順序是all參數(shù)里的數(shù)組的順序寞埠,即p1的結(jié)果在前屁置,即便p1的結(jié)果比p2的結(jié)果晚獲取到。這帶來了一個(gè)好處畸裳、在前端的數(shù)據(jù)使用中缰犁,偶爾會(huì)遇到發(fā)送多個(gè)請(qǐng)求并根據(jù)請(qǐng)求的順序獲取和使用數(shù)據(jù)的場(chǎng)景,使用Promise.all可以解決這個(gè)問題怖糊。
Promise.race
-
原理
有任意一個(gè)成功返回后帅容,就算完成,但是進(jìn)程不會(huì)立即停止伍伤。
-
常見使用場(chǎng)景
把異步操作和定時(shí)器放到一起并徘,如果定時(shí)器先觸發(fā),就認(rèn)為超時(shí)扰魂,通知用戶.比如獲取微信地理位置信息麦乞,如果超時(shí)則提醒用戶并且此時(shí)無法獲取地理微信進(jìn)行其他操作。
用法
let p1 = new Promise((resolve,reject) => {
setTimeout(() => {
resolve('成功了')
},2000);
})
let p2 = new Promise((resolve,reject) => {
setTimeout(() => {
reject('failed')
},500)
})
Promise.race([p1,p2]).then((result) => {
console.log(result)
}).catch((error) => {
console.log(error);//failed
})