async 和 await 目的是为了简化promise中api的使用,两种语法结合可以让异步代码和同步代码一样。
之前我们解决异步编程,可以使用像callback,promise这种方法,而在ES8中引入了async和await,我们先了解一下async函数
async
async简化了在函数返回值中对promise对象的创建,用法就是修饰函数,放在函数声明的最前面,并且async函数的返回值一定是一个Promise对象。
使用方法及返回值
async function test() {
}
let as = test();
console.log(as);
这里我并没有设置返回值,但是他默认返回了一个状态为成功的Promise对象。
还是上面的代码这次我给他一个返回值,返回一个字符串 {return “字符串”}
可以看到即使我给了他明确了返回值,但还是返回一个成功的Promise对象。
无论return返回值是什么,最后都是一个Promise对象,只是状态不一样
抛出错误
async function test() {
throw new Error("出现错误");
}
let as = test();
console.log(as);
这时async函数返回了一个失败的Promise对象,value是失败的对象
返回一个Promise对象
返回一个promise对象还是和一个非Promise对象还是有一点区别的
async function test1() {
return new Promise((resolve, reject) => {
resolve(3);
})
}
let as1 = test1();
console.log(as1);
async function test2() {
return new Promise((resolve, reject) => {
reject(3);
})
}
let as2 = test2();
console.log(as2);
那么可以得出一个结论:
返回一个promise对象得到的promise对象是未决状态,但是即将进入已决状态
而返回一个非Promise对象得到已经进入已决状态的Promise对象
但是这两种返回状态都可以调用then方法
async function test1() {
return new Promise((resolve, reject) => {
resolve(3);
})
}
let as1 = test1();
console.log(as1);
async function test2() {
return 3;
}
let as2 = test2();
console.log(as2);
as1.then(data => {
console.log(data);
});
as2.then(data => {
console.log(data);
});
无论是返回一个Promise对象还是非Promise像都可以使用then,或者catch方法。
最后总结一下:
1. 使用的时候 在普通的函数前面加上async 调用的时候 和普通函数一样调用
2.async函数的返回值一定是一个Promise对象。
3.返回的非Promise对象除了报错都是成功状态
4.返回一个promise对象得到的promise对象是未决状态,但是即将进入已决状态
5.返回一个非Promise对象得到已经进入已决状态的Promise对象
通常async和 await是一起用的。
await
await使用方法:
async里面可以没有await,但是await必须放在async里面
await后面一般是放一个Promise对象,await对象返回的是Promise的值
那我们就新建一个Promise对象
let test = new Promise((resolve, reject) => {
resolve("成功");
});
async function aw() {
let result = await test;
console.log(result);//成功
}
aw();
而如果是失败状态,那我们就要用try catch来捕获,最后在catch里进行错误处理
let test = new Promise((resolve, reject) => {
reject("失败");
});
async function aw() {
try {
let result = await test;
console.log(result);
} catch (error) {
console.log(error);//失败
}
}
aw();
我们来模拟一个场景,如果一个事件依赖于另一个事件的返回结果,那么我们就可以下面这样使用
async function test1() {
return "返回的结果";
}
async function test2() {
const res = await test1();//因为test1返回一个Promise对象所以可以直接调用
console.log(res);
}
test2();
(如果这篇文章有什么问题请及时联系我!)