JS async 函数的含义和用法实例总结

async函数概述

本文通过具体实例解析JavaScript中async函数的定义与使用方式，供读者参考学习。

基于前文学习内容进行归纳总结。

此前我们已了解多种异步编程方案，包括回调函数、Promise对象以及Generator函数。

随后介绍了两种自动执行机制：Thunk函数与co库。

为解决异步编程问题，开发者付出了诸多努力。

这反映出当前异步方案仍存在不足之处。

正是由于现有异步编程方式存在各类问题，才催生了相应的解决方案。

async函数原理与实现

今天我们将介绍最终的高级方案：async函数。

这个关键字在何处出现过？

在script标签中，可以通过添加async属性来实现脚本的异步加载与执行。

在ajax请求配置中，async参数用于设定同步或异步请求模式。

本文将介绍一种全新的使用场景：async函数。

参考前文读取文件的示例代码。

var gen = function* (){
 var f1 = yield readFile('/etc/fstab');
 var f2 = yield readFile('/etc/shells');
 console.log(f1.toString());
 console.log(f2.toString());
};

针对该示例，此前提供了两种解决方案：Thunk函数和co库。

这两种方案均需引入独立模块以构建自动执行器。

同时，对yield返回结果有严格限制。

async函数有效解决了上述问题。

首先展示async函数如何实现前述代码逻辑。

var asyncReadFile = async function (){
 var f1 = await readFile('/etc/fstab');
 var f2 = await readFile('/etc/shells');
 console.log(f1.toString());
 console.log(f2.toString());
};

仅需将原有的*替换为async，yield替换为await即可。

无需再编写Thunk和co代码，因为async函数内置了执行器。

无需限制await后的返回值类型，因为async会自动识别。

若为Promise对象则进行异步处理，若为原始类型则同步处理。

最为复杂的两处逻辑均由async自动完成。

尽管形式变化，其核心原理保持一致。

async函数实质上是将前文所述的Generator函数与自动执行器封装在一起。

此举降低了使用复杂度，但底层逻辑并未减少。

其使用方式与之前co库的使用方式相似。

使用注意事项

因此，最后列举使用async时需关注的关键点。

1. await命令后的Promise对象可能抛出异常，建议添加catch进行异常捕获。
2. await命令仅能在async函数内部使用，置于其他位置将导致报错。
3. 可利用Promise.all实现任务的并发执行。

至此，异步编程系列教程的学习内容已全部结束。

再次声明，本博客文章仅限个人学习使用，严禁任何形式的转载。

如需转载，请前往阮一峰老师的博客查看原文。

最后附上原文地址：async 函数的含义和用法。

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具：http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容可查看本站专题：《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》。

希望本文所述内容对大家学习JavaScript程序设计有所帮助。