Promise.all和Promise.race區別,和使用場景
阿新 • • 發佈:2018-06-08
返回 改變 停止 bsp 異步請求 con ESS res 參數
一、Pomise.all的使用
常見使用場景 : 多個異步結果合並到一起
Promise.all可以將多個Promise實例包裝成一個新的Promise實例。用於將多個Promise實例,包裝成一個新的Promise實例。
1.它接受一個數組作為參數。
2.數組可以是Promise對象,也可以是其它值,只有Promise會等待狀態改變。
3.當所有的子Promise都完成,該Promise完成,返回值是全部值的數組。
4.如果有任何一個失敗,該Promise失敗,返回值是第一個失敗的子Promise的結果。
Promise.all([p1,p2,p3])
先舉例之前我們 如果有多個異步請求,但是最終用戶想要得到的是 多個異步結果合並到一起,用之前代碼舉例
console.log(‘start‘); var result1,result2=""; //settimeout 模擬異步請求1 setTimeout(() => { result1="ok1" }, 2000); //settimeout 模擬異步請求2 setTimeout(() => { result1="ok2" }, 3000); //等待 異步1 異步2結果 var tempInterval= setInterval(()=>{ if(result1&&result2){ console.log(‘data result ok ,,, clearInterval‘) clearInterval(tempInterval); } },100)
使用Promise.all來解決 ,上代碼
let p1 = new Promise((resolve, reject) => { resolve(‘成功了‘) }) let p2 = new Promise((resolve, reject) => { resolve(‘success‘) }) let p3 = Promse.reject(‘失敗‘) Promise.all([p1, p2]).then((result)=> { console.log(result) //[‘成功了‘, ‘success‘] }).catch((error) => { console.log(error) }) Promise.all([p1,p3,p2]).then((result) => { console.log(result) }).catch((error) => { console.log(error) // 失敗了,打出 ‘失敗‘ })
二、Pomise.race的使用
類似於Promise.all() ,區別在於 它有任意一個返回成功後,就算完成,但是 進程不會立即停止
常見使用場景:把異步操作和定時器放到一起,如果定時器先觸發,認為超時,告知用戶
let p1 = new Promise((resolve, reject) => { setTimeout(() => { resolve(‘成功了‘) }, 2000); }) let p2 = new Promise((resolve, reject) => { setTimeout(() => { resolve(‘success‘) }, 5000); }) Promise.race([p1, p2]).then((result) => { console.log(result) //[‘成功了‘, ‘success‘] }).catch((error) => { console.log(error) })
Promise.all和Promise.race區別,和使用場景