Promise第三篇：async和await关键字

在此之前的两篇文章已经把Promise的用法交代清楚了，Promise确实很好的解决了回调地狱等异步处理出现的问题，提高了代码的阅读性，但是在代码形式上较为复杂，还有很多回调的感觉，不易于阅读和理解。因此ES6还新增了async和await两个关键字，作为简化Promise API的方法，注意，只是简化，而并不是代替Promise

目录

1.async

2.await

---

1.async

1）用法

async用于修饰函数（无论是函数字面量还是函数表达式），放置在函数声明前位置，被修饰函数的返回结果一定是Promise对象，其目的在于简化函数的返回值中的Promise的创建。

2）示例

【例1】

async function test() {console.log(1);return 5; } const pro = test(); console.log(pro);

 该段代码相当于

function test() {return new Promise((resolve,reject)=>{console.log(1);resolve(5)}) } const pro = test(); console.log(pro);

相比较之下，我们可以看出来async更加方便简洁，两段代码的打印结果均如图1

图1

2.await

1）用法

await用在某个表达式之前，如果表达式是一个Promise，则得到的是thenable中的状态数据【例2-1】；如果表达式不是Promise，则会将其使用Promise.resolve包装后按照规则进行运行【例2-2】

2）示例

【例2-1】

async function test1() {console.log(1);return 2; } async function test2() {const result = await test1();console.log(result); } test2();

该段代码相当于

function test1() {return new Promise((resolve, reject) => {console.log(1);resolve(2);}) }function test2() {return new Promise((resolve, reject) => {test1().then(resp => {const result = respconsole.log(result);})}) } test2()

【结果】

图2-1

【例2-2】

async function test() {const result = await 1;console.log(result); } test(); console.log(124);

该段代码相当于

function test() {return new Promise((resolve,reject)=>{Promise.resolve(1).then(data=>{const result = data;console.log(result);resolve();})}) } test(); console.log(124);

【结果】

图2-2

【例2-3】以上的例子都是resolve状态，接下类康康reject状态怎么处理

async function getPromise() {if (Math.random()> 0.5) {return 1;} else {throw 2;} } async function test(){try {const result = await getPromise();console.log('success',result);} catch (err) {console.log('error',err)} } test();

 【结果】如果事件推向resolved状态，则运行try中的代码，打印结果如图2-3-1；如果事件推向rejected状态，则运行catch中的代码，打印结果如图2-3-2

图2-3-1 图2-3-1

 

总结

以上是生活随笔为你收集整理的Promise第三篇：async和await关键字的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。