Javascript中的async awai的用法

async / await是ES7的重要特性之一，也是目前社区里公认的优秀异步解决方案。目前，async / await这个特性已经是stage 3的建议，可以看看TC39的进度，本篇文章将分享async / await是如何工作的，阅读本文前，希望你具备Promise、generator、yield等ES6的相关知识。

在详细介绍async / await之前，先回顾下目前在ES6中比较好的异步处理办法。下面的例子中数据请求用Node.js中的request模块，数据接口采用Github v3 api文档提供的repo代码仓库详情API作为例子演示。

Promise对异步的处理

虽然Node.js的异步IO带来了对高并发的良好支持，同时也让“回调”成为灾难，很容易造成回调地狱。传统的方式比如使用具名函数，虽然可以减少嵌套的层数，让代码看起来比较清晰。但是会造成比较差的编码和调试体验，你需要经常使用用ctrl + f去寻找某个具名函数的定义，这使得IDE窗口经常上下来回跳动。使用Promise之后，可以很好的减少嵌套的层数。另外Promise的实现采用了状态机，在函数里面可以很好的通过resolve和reject进行流程控制，你可以按照顺序链式的去执行一系列代码逻辑了。下面是使用Promise的一个例子：

const request = require('request');// 请求的url和headerconst options = { url: 'https://api.github.com/repos/cpselvis/zhihu-crawler', headers: {  'User-Agent': 'request' }};// 获取仓库信息const getRepoData = () => { return new Promise((resolve, reject) => {  request(options, (err, res, body) => {   if (err) {    reject(err);   }   resolve(body);  }); });};getRepoData() .then((result) => console.log(result);) .catch((reason) => console.error(reason););// 此处如果是多个Promise顺序执行的话，如下：// 每个then里面去执行下一个promise// getRepoData()//  .then((value2) => {return promise2})//  .then((value3) => {return promise3})//  .then((x) => console.log(x))

不过Promise仍然存在缺陷，它只是减少了嵌套，并不能完全消除嵌套。举个例子，对于多个promise串行执行的情况，第一个promise的逻辑执行完之后，我们需要在它的then函数里面去执行第二个promise，这个时候会产生一层嵌套。另外，采用Promise的代码看起来依然是异步的，如果写的代码如果能够变成同步该多好啊！

Generator对异步的处理

谈到generator，你应该不会对它感到陌生。在Node.js中对于回调的处理，我们经常用的TJ / Co就是使用generator结合promise来实现的，co是coroutine的简称，借鉴于python、lua等语言中的协程。它可以将异步的代码逻辑写成同步的方式，这使得代码的阅读和组织变得更加清晰，也便于调试。

const co = require('co');const request = require('request');const options = { url: 'https://api.github.com/repos/cpselvis/zhihu-crawler', headers: {  'User-Agent': 'request' }};// yield后面是一个生成器 generatorconst getRepoData = function* () { return new Promise((resolve, reject) => {  request(options, (err, res, body) => {   if (err) {    reject(err);   }   resolve(body);  }); });};co(function* () { const result = yield getRepoData; // ... 如果有多个异步流程，可以放在这里，比如 // const r1 = yield getR1; // const r2 = yield getR2; // const r3 = yield getR3; // 每个yield相当于暂停，执行yield之后会等待它后面的generator返回值之后再执行后面其它的yield逻辑。 return result;}).then(function (value) { console.log(value);}, function (err) { console.error(err.stack);});