文章主要涉及關(guān)于promise的方法使用地熄，不會(huì)涉及太多理論性的東西，簡(jiǎn)單的講講它的方法調(diào)用挽牢，好廢話不多說进副，直接看代碼
本章涉及以下幾點(diǎn)
- 如何創(chuàng)建一個(gè)Promise對(duì)象
- 參數(shù)講解
- 鏈?zhǔn)秸{(diào)用
- catch()捕捉異常
- Promise.all()方法講解
- Promise.race() 方法講解
- 手動(dòng)的更改狀態(tài) Promise.resolve() | Promise.reject()
如何創(chuàng)建promise對(duì)象
創(chuàng)建一個(gè)promise對(duì)象很簡(jiǎn)單 直接看代碼
const p1 = new Promise((resolve,reject) => {
const value = 'hello';
resolve(value);
});
像上面這樣就簡(jiǎn)單的創(chuàng)建了一個(gè)promise對(duì)象
參數(shù)講解
const p1 = new Promise((resolve,reject) => {
if(true){
resolve('success')
}else{
reject('err')
}
});
上面的例子中傳了兩個(gè)參數(shù)：
- reslove 成功的狀態(tài)
- reject 失敗的狀態(tài)
他們兩個(gè)執(zhí)行的方法里都可以傳一個(gè)值砂吞，即成功傳入和失敗傳入 。下面我們看下鏈?zhǔn)秸{(diào)用
鏈?zhǔn)秸{(diào)用
先看一段代碼 ：
const p1 = new Promise((resolve,reject) => {
const value = 'hello';
resolve(value); // 此時(shí)觸發(fā)成功
//reject(value); // 如果是失敗 同時(shí)我們也傳入value
});
p1.then(data => {
console.log(data); // hello
return data+'world';
}, err => {
console.log(err); // 返回的是 reject(value) 的值
return err+'err';
}).then(data => {
console.log(data); // helloworld 繼續(xù)上一次data的返回值 如果沒有 就返回undefined
},err => {
console.log(err); // helloerr 同理 繼續(xù)返回上一次err的返回值
})
通過代碼我們很容易理解它們的作用
catch 捕捉異常
通常我們不會(huì)在then方法多傳入一個(gè)參數(shù)而是用catch來捕捉錯(cuò)誤的信息 繼續(xù)上面的例子
p1.then(data => {
console.log(data);
return data+'world';
}).catch(err => {
console.log(err); // hello
return "reject";
}).then(data => {
console.log(data);
}).catch(err => {
console.log(err); // reject
})
Promise.all()方法
它傳入一個(gè)promise對(duì)象的列表 直接看代碼
const arr = [1,2,3,4];
const promiseArr = arr.map(arg => {
return new Promise((resolve,reject) => {
if(arg) {
resolve(arg*2);
}else{
reject('no value');
}
})
});
Promise.all(promiseArr).then(data => {
console.log(data); // [2,4,6,8]
}).catch(err => {
console.log(err);
})
Promise.race()方法
同樣的它傳入的也是promise對(duì)象列表 不過他們執(zhí)行順序是按照誰快 誰先輸出
const pro1 = new Promise((resolve,reject) => {
setTimeout(resolve,100,'1');
});
const pro2 = new Promise((resolve,reject) => {
setTimeout(resolve,200,'2');
});
const pro3 = new Promise((resolve,reject) => {
setTimeout(resolve,300,'3');
});
const pro4 = new Promise((resolve,reject) => {
setTimeout(resolve,10,'4');
});
Promise.race([pro4,pro1,pro2,pro3]).then(data => {
console.log(data); // 1 輸出最快的那個(gè)
}).catch(err => {
console.log(err);
})
兩種實(shí)例狀態(tài)
Promise.resolve() | Promise.reject() 兩個(gè)方法很容易理解 即手動(dòng)去改變它們的狀態(tài)：
const p_1 = Promise.resolve('success');
p_1.then(data => {
console.log(data); // success
})
const p_2 = Promise.reject('err');
p_2.then(data => {
console.log(data);
}).catch(err => {
console.log(err); // err
})
