async await 语法是 ES7出现的,是基于ES6的 promise和generator实现的。,这里就不再赘述generator,专门的文章讲专门的内容。,我们先看看下面这代码,这是async await的最简单使用,await后面返回的是一个Promise对象:,但不知你有没有想过一个问题,为什么会等到返回的promise的对象的状态为非pending的时候才会继续往下执行,也就是resolve执行之后,才会继续执行,就像下面的代码一样。,
,可以看到运行结果是先打印了1,再打印2了,也就是说明在返回的promise对象没执行resolve()前,就一直在await,等它执行。然后再执行下面的程序,那这个是怎么实现的呢?,我们看一下下面的代码,输出顺序是什么?,没错是 1,2,3.。,那用generator函数专门来实现这个效果呢?,我一开始这样来实现:,但是发现打印顺序是 3,2,1.明显不对。,这里的问题主要是三个 new Promise几乎是同一时刻执行了。才会出现这种问题,所以需要等第一个promise执行完resolve之再执行下一个,所以要这么实现。,
,可以看到这样就打印正常了。,但是呢,总不能有多少个await,就要自己写多少个嵌套吧,所以还是需要封装一个函数,显然,递归实现最简单。,再来看看打印结果:,
,可以发现成功执行了,但是为什么报错了?,这是因为generator方法会返回四次,最后一次的value是undefined。,而实际上返回第三次就表示已经返回done,代表结束了,所以,我们需要判断是否是已经done了,不再让它继续递归。,所以可以改成这样:,
,可以看到这样就实现了。,完美,这个co其实也是大名鼎鼎的co函数的简单写法。,本篇文章关于async 和 await的原理揭秘就到此为止了,再讲下去就不礼貌了。
© 版权声明
文章版权归作者所有,未经允许请勿转载。