promise的用法
Promise,簡(jiǎn)單來說就是一個(gè)容器艾疟，里面保存著某個(gè)未來才會(huì)結(jié)束的時(shí)間(通常是一個(gè)異步操作的結(jié)果)
Promise構(gòu)造函數(shù)接收一個(gè)函數(shù)作為參數(shù)，該函數(shù)的兩個(gè)參數(shù)是resolve敢辩，reject蔽莱，它們由JavaScript引擎提供。其中resolve函數(shù)的作用是當(dāng)Promise對(duì)象轉(zhuǎn)移到成功,調(diào)用resolve并將操作結(jié)果作為其參數(shù)傳遞出去戚长；
reject函數(shù)的作用是單Promise對(duì)象的狀態(tài)變?yōu)槭r(shí)盗冷，將操作報(bào)出的錯(cuò)誤作為其參數(shù)傳遞出去。
let p = new Promise((resolve,reject) => {
resolve('success')
});
Promise的then方法
promise的then方法帶有以下三個(gè)參數(shù)：成功回調(diào)同廉，失敗回調(diào)仪糖，前進(jìn)回調(diào)，一般情況下只需要實(shí)現(xiàn)第一個(gè)迫肖，后面是可選的锅劝。Promise中最為重要的是狀態(tài)，通過then的狀態(tài)傳遞可以實(shí)現(xiàn)回調(diào)函數(shù)鏈?zhǔn)讲僮鞯膶?shí)現(xiàn)
let p = new Promise((resolve,reject) => {
resolve('success')
})
p.then(result => {
console.log(result);
//success
});
Promise的其他方法
catch用法
function myPromise(res){
return new Promise((resolve,reject)=>{
if(res.data){
resolve("成功數(shù)據(jù)");
}else{
reject("失敗數(shù)據(jù)");
}
});
}
myPromise().then((message)=>{
console.log(message);
}
)
.catch((message)=>{
console.log(message);
})
這個(gè)時(shí)候catch執(zhí)行的是和reject一樣的咒程，也就是說如果Promise的狀態(tài)變?yōu)閞eject時(shí)鸠天，會(huì)被catch捕捉到，不過需要特別注意的是如果前面設(shè)置了reject方法的回調(diào)函數(shù)帐姻，·則catch不會(huì)捕捉到狀態(tài)變?yōu)閞eject的情況。catch還有一點(diǎn)不同的是奶段，如果在resolve或者reject發(fā)生錯(cuò)誤的時(shí)候饥瓷，會(huì)被catch捕捉到，這樣就能避免程序卡死在回調(diào)函數(shù)中了痹籍。
all用法
romise的all方法提供了并行執(zhí)行異步操作的能力呢铆，在all中所有異步操作結(jié)束后才執(zhí)行回調(diào)。
function p1(){
return new Promise((resolve,reject)=>{
resolve("p1完成");
})
}
function p2(){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve("p2完成")
},2000);
})
}
function p3(){
return new Promise((resolve,reject)=>{
resolve("p3完成")
});;
}
Promise.all([p1(),p2(),p3()])
.then((data)=>{
console.log(data);
})
這里可以看到p2的resolve放到一個(gè)setTimeout中蹲缠，最后的.then也會(huì)等到所有Promise完成狀態(tài)的改變后才執(zhí)行棺克。
race用法
在all中的回調(diào)函數(shù)中悠垛，等到所有的Promise都執(zhí)行完，再來執(zhí)行回調(diào)函數(shù)娜谊，race則不同它等到第一個(gè)Promise改變狀態(tài)就開始執(zhí)行回調(diào)函數(shù)确买。將上面的all改為race,得到
Promise.race([p1(),p2(),p3()])
.then(function(data){
console.log(data);
})
async、await
異步編程的最高境界就是不關(guān)心它是否是異步纱皆。async湾趾、await很好的解決了這一點(diǎn)，將異步強(qiáng)行轉(zhuǎn)換為同步處理派草。async/await與promise不存在誰代替誰的說法搀缠，因?yàn)閍sync/await是寄生于Promise，是Generater的語法糖近迁。
用法
async用于申明一個(gè)function是異步的艺普，而await可以認(rèn)為是async wait的簡(jiǎn)寫，等待一個(gè)異步方法執(zhí)行完成鉴竭。規(guī)則：
1 async和await是配對(duì)使用的歧譬，await存在于async的內(nèi)部。否則會(huì)報(bào)錯(cuò)
2 await表示在這里等待一個(gè)promise返回拓瞪，再接下來執(zhí)行
3 await后面跟著的應(yīng)該是一個(gè)promise對(duì)象缴罗，（也可以不是，如果不是接下來也沒什么意義了…）
寫法：
async function demo() {
let result01 = await sleep(100);
//上一個(gè)await執(zhí)行之后才會(huì)執(zhí)行下一句
let result02 = await sleep(result01 + 100);
let result03 = await sleep(result02 + 100);
// console.log(result03);
return result03;
}
demo().then(result => {
console.log(result);
});`
錯(cuò)誤捕獲
let p = new Promise((resolve,reject) => {
setTimeout(() => {
reject('error');
},1000);
});
async function demo(params) {
try {
let result = await p;
}catch(e) {
console.log(e);
}
}
demo();
區(qū)別：
- promise是ES6祭埂，async/await是ES7
- async/await相對(duì)于promise來講面氓，寫法更加優(yōu)雅
- reject狀態(tài)：
- promise錯(cuò)誤可以通過catch來捕捉，建議尾部捕獲錯(cuò)誤蛆橡，
- async/await既可以用.then又可以用try-catch捕捉
