async函数,了解一下

原创 w3cxiaduntian 教程 es6 251阅读 2018-05-06 10:34:16 举报

今天,带大家来谈谈ES6中的async函数,我们在理解一个概念的时候,无外乎这是三个方面

  • 是什么
  • 为什么
  • 怎么用

如果感觉文章太长,可以直接拉到下面,看小结🙄

sync是什么

ES7提供了async函数,使得异步操作变得更加方便。async函数是什么?一句话,async函数就是Generator函数的语法糖。

我们来个案例,取读文件

Generator函数

写成async函数,就是下面这样。

一比较就会发现,async函数就是将Generator函数的星号(*)替换成async,将yield替换成await,仅此而已。

我们会想,为什么明明有Generator函数,还需要async函数

为什么需要async函数

async函数对 Generator 函数的改进,体现在以下四点。

(1)内置执行器。Generator函数的执行必须靠执行器,所以才有了co模块,而async函数自带执行器。也就是说,async函数的执行,与普通函数一模一样,只要一行。

上面的代码调用了asyncReadFile函数,然后它就会自动执行,输出最后结果。这完全不像Generator函数,需要调用next方法,或者用co模块,才能得到真正执行,得到最后结果。

(2)更好的语义。async和await,比起星号和yield,语义更清楚了。async表示函数里有异步操作,await表示紧跟在后面的表达式需要等待结果。

(3)更广的适用性。 co模块约定,yield命令后面只能是Thunk函数或Promise对象,而async函数的await命令后面,可以是Promise对象和原始类型的值(数值、字符串和布尔值,但这时等同于同步操作)。

(4)返回值是Promise。async函数的返回值是Promise对象,这比Generator函数的返回值是Iterator对象方便多了。你可以用then方法指定下一步的操作。

进一步说,async函数完全可以看作多个异步操作,包装成的一个Promise对象,而await命令就是内部then命令的语法糖。

语法

async怎么使用呢?

一个函数前面加上async,就可以让这个函数数成为异步函数,跳出原本的执行顺序

(1)async函数返回一个Promise对象。

async函数内部return语句返回的值,会成为then方法回调函数的参数。

上面代码中,函数f内部return命令返回的值,会被then方法回调函数接收到。

async函数内部抛出错误,会导致返回的Promise对象变为reject状态。抛出的错误对象会被catch方法回调函数接收到。

(2)async函数返回的Promise对象,必须等到内部所有await命令的Promise对象执行完,才会发生状态改变。也就是说,只有async函数内部的异步操作执行完,才会执行then方法指定的回调函数。

下面是一个例子。

(3)正常情况下,await命令后面是一个Promise对象。如果不是,会被转成一个立即resolve的Promise对象。

上面代码中,await命令的参数是数值123,它被转成Promise对象,并立即resolve。

await命令后面的Promise对象如果变为reject状态,则reject的参数会被catch方法的回调函数接收到。

注意,上面代码中,await语句前面没有return,但是reject方法的参数依然传入了catch方法的回调函数。这里如果在await前面加上return,效果是一样的。

只要一个await语句后面的Promise变为reject,那么整个async函数都会中断执行。

上面代码中,第二个await语句是不会执行的,因为第一个await语句状态变成了reject。

为了避免这个问题,可以将第一个await放在try...catch结构里面,这样第二个await就会执行。

另一种方法是await后面的Promise对象再跟一个catch方面,处理前面可能出现的错误。

如果有多个await命令,可以统一放在try...catch结构中。

(4)如果await后面的异步操作出错,那么等同于async函数返回的Promise对象被reject。

上面代码中,async函数f执行后,await后面的Promise对象会抛出一个错误对象,导致catch方法的回调函数被调用,它的参数就是抛出的错误对象。具体的执行机制,可以参考后文的“async函数的实现”。

防止出错的方法,也是将其放在try...catch代码块之中。


小结

  1. async比generstor更好,语法上更语义化,内置执行器
  2. async返回值是Promise,函数内部的return值,会成为then方法回调函数的参数。
  3. await只能在async函数内部使用
  4. 如果await后面的异步操作出错,那么等同于async函数返回的Promise对象被reject

首发于微信公众号:node前端

不妨关注一下,我们一起学习

回复:100

有福利哦

image.png

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复