Promise 與 async函式
阿新 • • 發佈:2018-11-30
Promise 例項一經建立,執行器立即執行。
new Promise((resolve, reject)=>{ setTimeout(()=>{ resolve('hello'); },10000); }).then(value=>{ return new Promise((resolve, reject)=>{ ..... }); }).then(value=>{ console.log(value); }).catch(err=>{ console.log(err); }).finally(value=>{ });
new Promise(function(resolve, reject){})
.then(function(value){})。Promise裡面的函式是立即執行的。等到裡面函式呼叫了resolve函式後,才會呼叫then中的function。then中預設會返回一個空Promise,此promise會預設立即執行resolve。也可以自己return一個promise,等此Promise中呼叫了resolve後才會繼續佇列中的then。
批量執行
Promise.all([p1,p2,p3]);
當所有子Promise都完成,該Promise完成,返回值是全部值的陣列。
有任何一個失敗,該Promise失敗,返回值是第一個失敗的子Promise的結果。
Promise.race([p1,p2,p3]);
區別在於,它只要有一個完成就算完成。
常見用法。
把非同步操作和定時器放在一起。
如果定時器先觸發,就認為超時,告知使用者。
把回撥包裝成Promise
有兩個好處,1.可讀性更好。2,返回的結果可以加入任何Promise佇列。
async
async
函式返回一個 Promise 物件,可以使用then
方法添加回調函式。當函式執行的時候,一旦遇到
await
就會先返回,等到非同步操作完成,再接著執行函式體內後面的語句。
async
函式內部return
語句返回的值,會成為then
方法回撥函式的引數。
function timeout(ms) {
return new Promise((resolve) => {
setTimeout(resolve, ms);
});
}
async function asyncPrint(value, ms) {
await timeout(ms);
console.log(value);
}
asyncPrint('hello world', 50);
處理異常。
async function f() {
await Promise.reject('出錯了')
.catch(e => console.log(e));
return await Promise.resolve('hello world');
}
f()
.then(v => console.log(v))
// 出錯了
// hello world
如果有多個await
命令,可以統一放在try...catch
結構中。
async function main() {
try {
const val1 = await firstStep();
const val2 = await secondStep(val1);
const val3 = await thirdStep(val1, val2);
console.log('Final: ', val3);
}
catch (err) {
console.error(err);
}
}
await
命令後面的Promise
物件,執行結果可能是rejected
,所以最好把await
命令放在try...catch
程式碼塊中。
await
命令只能用在async
函式之中,如果用在普通函式,就會報錯。