以前使用promise都是用時會,用時理解,事後一段時間沒有又忘了,今天有空正好整理一下,方便往後本身查閱。-- 代碼來源於阮一峯老師的 promise數組
Promise有4個方法:promise
[ resolve, reject, all, race ]dom
常見的resolve和reject 異步
resolve: 成功時的回調函數函數
reject: 失敗時的回調函數spa
//定義 Promise 的回調函數 function test(resolve, reject) { //採用隨機數來模擬成功和失敗。 var timeOut = Math.random() * 2; console.log('set timeout to: ' + timeOut + ' seconds.'); setTimeout(function(){ if (timeOut < 1) { // 成功 resolve console.log('call resolve()....'); resolve('200 ok'); } else { // 失敗 reject console.log('call reject()...'); reject('timeout in:' + timeOut + ' seconds.'); } }, timeOut * 100); } new Promise(test) .then(result => { //成功後進行的代碼操做 console.log('success'); }) .catch(reason => { //失敗後進行的代碼操做 console.log('fail'); })
這裏的test回調函數是來處理請求數據,接口等的, 然後面的then就是來執行請求成功後的操做, catch是來處理失敗後的操做。code
Promise.all(數組) 同時進行的異步操做blog
// Promise.all(數組) 同時進行的異步操做 var p1 = new Promise((resolve, reject)=>{
// 採用隨機數來模擬成功和失敗。 var err = Math.random() > .5 ? true : false; if (err) { setTimeout(reject, 600, 'P1'); } else { setTimeout(resolve, 600, 'P1'); } }) var p2 = new Promise((resolve, reject)=>{
//採用隨機數來模擬成功和失敗。 var err = Math.random() > .5 ? true : false; if (err) { setTimeout(reject, 300, 'P2'); } else { setTimeout(resolve, 300, 'P2'); } }) //p1,p2操做成功就執行then Promise.all([p1, p2]).then(results=>{ console.log('成功: '+results); }) //p1,p2其中有一個操做失敗就執行catch .catch(reason=> { console.log('錯誤:'+reason); })
Promise.race([p1, p2]) 對同時進行的異步操做,那個先執行完就採用那個(好比:同時向兩個URL讀取用戶的我的信息,只須要得到先返回的結果便可。[阮一峯老師的好比])接口
var p1 = new Promise((resolve, reject)=>{ var err = Math.random() > .5 ? true : false; if (err) { setTimeout(reject, 600, 'P1'); } else { setTimeout(resolve, 600, 'P1'); } }) var p2 = new Promise((resolve, reject)=>{ var err = Math.random() > .5 ? true : false; if (err) { setTimeout(reject, 300, 'P2'); } else { setTimeout(resolve, 300, 'P2'); } }) // p1,p2同時操做,哪個先獲得結果就執行那個,成功執行then,失敗就執行catch Promise.race([p1, p2]).then(results=>{ console.log('成功: '+results); }).catch(reason=> { console.log('錯誤:'+reason); })
完(皮皮蝦, 皮一下)。get