参考博客:https://www.jianshu.com/p/b4fd76c61dc9
两种等待
async中文意思是异步;await中文意思是等待
首先要明白,等待有分2种,一种是干等着,等待的时候不做其他事情;一种是边等边做其他事情。await这种等待是后者。
代码实例
// 以吃饭、睡觉、手机充电、拔电源为例子
function lunch(){
return new Promise((resolve, reject) => {
console.log("吃饭ing");
resolve("吃完饭了");
})
}
function sleep(){
return new Promise((resolve, reject) => {
console.log("睡觉ing");
resolve("起床");
})
}
function mobilePhoneCharging(){
return new Promise((resolve, reject) => {
console.log("手机充电ing");
resolve("手机充电完成");
})
}
function powerOff(){
console.log("拔电源");
}
- 没有async/await的版本去执行
function main(){
// 要先吃饭在睡觉
lunch().then(res => {
console.log(res );
sleep();
})
// 但是手机充电不需要先吃饭,可以吃饭前就开始充电
mobilePhoneCharging().then(res => {
console.log(res);
powerOff();
})
}
// 错误的做法
async function main(){
let lunchRes = await lunch()
console.log(lunchRes);
leep();
// 这种写法是错误的,因为本来mobilePhoneCharging是不依赖lunch的,现在要等待完lunch执行完才能执行mobilePhoneCharging
let mobilePhoneChargingRes = await mobilePhoneCharging();
console.log(mobilePhoneChargingRes );
powerOff();
}
// 正确的做法
function main(){
// 因为lunchAndSleep被标记成了一个异步方法
// 所以lunchAndSleep方法执里执行被阻塞了,不影响外面,外面还是继续走。
// 也就是main方法边等lunchAndSleep执行完,边做其他事情。
lunchAndSleep();
mobilePhoneChargingAndPowerOff();
}
async function lunchAndSleep(){
// 加了await,那么就要执行完这个方法,才会继续往下走
// 所以async方法里是同步执行的
let res = await lunch()
console.log(res)
leep();
}
async function mobilePhoneChargingAndPowerOff(){
let res = await mobilePhoneCharging();
console.log(res)
powerOff();
}
语法补充
1.方法里如果想使用await关键字,那么该方法就要被async修饰。因为你想阻塞方法内部,就不能影响外面执行,所以这个方法是要被标记成异步的
2.await methodA(),那么methodA方法返回值就必须要是promise,并且await methodA()是拿promise方法的resolve值