为了解决上方Generator函数需手动执行next方法的问题，TJ Holowaychuk大神编写了一个co函数库，能够使Generator 函数可以自动执行，比如原来我们需要这样：
let files = function* (){ var f1 = yield readFile('/xxx/xxx'); // 读取file1文件 var f2 = yield readFile('/xxx/xxx'); // 读取file2文件 console.log(f1.toString()); console.log(f2.toString()); }; files.next(); // 执行yield files.next(); // 执行yield
使用co后：
var co = require('co'); co(files);
co 函数返回一个 Promise 对象，因此可以用 then 方法添加回调函数。
co(files).then(() => { console.log('执行完成'); });
最后我们可以看到我们没有手动执行next方法，也会打印出所读取的文件。
co模块虽然很好的帮助了我们解决了Generator函数必须靠执行器的问题，但是使用起来我们都需要额外引入一个模块，那么有没有更加方便的方式来解决呢？继续往下看。
5. async and await
除了以上4中方式可以解决Javascript异步编程的问题外，ES7还提供了更加方便的async 函数和await命令，了解一下？
其实async是 Generator 函数的语法糖，不同点在于其内置了执行器，也就是说async函数自带执行器。看一下下面的例子：
let p1 = new Promise((resolve, reject) => { setTimeout(() => { resolve(1); }, 1000); }); let p2 = new Promise((resolve, reject) => { setTimeout(() => { resolve(2); }, 1000); }); async function waitFn() { let a = await p1; // await命令后面可以是 Promise 对象和原始类型的值，如果使原始类型最终也会返回为Promise对象 let b = await p2; return a + b } // async函数的返回值是 Promise 对象， 可以用then方法指定下一步的操作 waitFn().then(result => { console.log(result); // 2s后输出3 });
async函数内部return语句返回的值，会成为then方法回调函数的参数。因此这就像极了利用co包裹起来的Generator函数，只是把*替换成了async，把yield替换成了await。
可以说async and await 是ES7中最重要的一个特性，虽然其也存在一些弊端，但是相比较而言用其处理异步代码来说还是比较得心应手的。
结语
本文简单介绍了处理好Javascript异步代码的五种常见方式，每一种方式都有其使用和存在的条件和必要性，有兴趣的同学可以对其进行单独的拓展和探究，只有了解并掌握每一种方式各自的优点并加以运用，才能享受异步编程带来的快感。
以上所述是小编给大家介绍的JavaScript异步代码优化详解整合，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
您可能感兴趣的文章: