async 函数的含义和用法 - 阮一峰的网络日志

二、async 函数是什么？

一句话，async 函数就是 Generator 函数的语法糖。

前文有一个 Generator 函数，依次读取两个文件。

var fs = require('fs'); var readFile = function (fileName){ return new Promise(function (resolve, reject){ fs.readFile(fileName, function(error, data){ if (error) reject(error); resolve(data); var gen = function* (){ var f1 = yield readFile('/etc/fstab'); var f2 = yield readFile('/etc/shells'); console.log(f1.toString()); console.log(f2.toString());

写成 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 函数就是将 Generator 函数的星号（*）替换成 async，将 yield 替换成 await，仅此而已。

三、async 函数的优点

async 函数对 Generator 函数的改进，体现在以下三点。

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

var result = asyncReadFile();

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

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

四、async 函数的实现

async 函数的实现，就是将 Generator 函数和自动执行器，包装在一个函数里。

async function fn(args){ // ... // 等同于 function fn(args){ return spawn(function*() { // ...

所有的 async 函数都可以写成上面的第二种形式，其中的 spawn 函数就是自动执行器。

下面给出 spawn 函数的实现，基本就是前文自动执行器的翻版。

async 函数是非常新的语法功能，新到都不属于 ES6，而是属于 ES7。目前，它仍处于提案阶段，但是转码器 Babel 和 regenerator 都已经支持，转码后就能使用。

五、async 函数的用法

同 Generator 函数一样，async 函数返回一个 Promise 对象，可以使用 then 方法添加回调函数。当函数执行的时候，一旦遇到 await 就会先返回，等到触发的异步操作完成，再接着执行函数体内后面的语句。

下面是一个例子。

async function getStockPriceByName(name) { var symbol = await getStockSymbol(name); var stockPrice = await getStockPrice(symbol); return stockPrice; getStockPriceByName('goog').then(function (result){ console.log(result);

上面代码是一个获取股票报价的函数，函数前面的async关键字，表明该函数内部有异步操作。调用该函数时，会立即返回一个Promise对象。

下面的例子，指定多少毫秒后输出一个值。

function timeout(ms) { return new Promise((resolve) => { setTimeout(resolve, ms); async function asyncPrint(value, ms) { await timeout(ms); console.log(value) asyncPrint('hello world', 50);

上面代码指定50毫秒以后，输出"hello world"。

六、注意点

await 命令后面的 Promise 对象，运行结果可能是 rejected，所以最好把 await 命令放在 try...catch 代码块中。

async function myFunction() { try { await somethingThatReturnsAPromise(); } catch (err) { console.log(err); // 另一种写法 async function myFunction() { await somethingThatReturnsAPromise().catch(function (err){ console.log(err);

await 命令只能用在 async 函数之中，如果用在普通函数，就会报错。

async function dbFuc(db) { let docs = [{}, {}, {}]; // 报错 docs.forEach(function (doc) { await db.post(doc);

上面代码会报错，因为 await 用在普通函数之中了。但是，如果将 forEach 方法的参数改成 async 函数，也有问题。

async function dbFuc(db) { let docs = [{}, {}, {}]; // 可能得到错误结果 docs.forEach(async function (doc) { await db.post(doc);

上面代码可能不会正常工作，原因是这时三个 db.post 操作将是并发执行，也就是同时执行，而不是继发执行。正确的写法是采用 for 循环。

async function dbFuc(db) { let docs = [{}, {}, {}]; for (let doc of docs) { await db.post(doc);

如果确实希望多个请求并发执行，可以使用 Promise.all 方法。

async function dbFuc(db) { let docs = [{}, {}, {}]; let promises = docs.map((doc) => db.post(doc)); let results = await Promise.all(promises); console.log(results); // 或者使用下面的写法 async function dbFuc(db) { let docs = [{}, {}, {}]; let promises = docs.map((doc) => db.post(doc)); let results = []; for (let promise of promises) { results.push(await promise); console.log(results);

fiber就是lua 里的协成 py的goagent php7里的yield unity3d引擎的crountine 一看到yield就是其实也不自然。。
ruby的fiber也是这样的。。。。
相对来说c#的方案看起来做优雅就是typescript 新版里的那个。。。。

写代码有些年了，说实话，阮老师有关javascript的文章，我一篇都看不懂，好像不太像阮老师写的东西？不知阮老师能否写一个从头到尾有主线+实际运用的javascript序列？带人入门，让人自己修行。这些javascript招式片段才能让人看懂，使人收益？
嗯？留言会保留？

async function dbFuc(db) {
let docs = [{}, {}, {}];
let promises = docs.map((doc) => db.post(doc));

let results = [];
for (let promise of promises) {
results.push(await promise);
console.log(results);
这个不是并发的，应该是继发的。for循环中的promise是db.post(doc)产生的。更改为这样子的是不是就可以了： results.push(await Promise.reslove(promise));,用Promise.reslove重新创建一个状态为resolved的对象，这样spawn自动执行器就会同步遍历了，因为这时候的promise的状态是resolved。
不过上面的实现麻烦，直接用Promise.all()吧。

function ayncSelf(self) {
var _promise = new Promise((resolve)=>{
setTimeout(()=>{resolve(self)},1000);
return _promise

async function dbFuc(db) {
console.log('start:',new Date());
let docs = [1, 2, 3];
let promises = docs.map((doc) => ayncSelf(doc));

let results = [];
for (let promise of promises) {
results.push(await promise);
console.log(results);
console.log('end:',new Date());

试试这个代码,整个代码执行时间大约1秒,说明这些异步操作是一起执行的

Promise.all([a, b].map(p => p.catch(e => e)))
.then(results => console.log(results))
.catch(e => console.log(e));

> 一比较就会发现，async 函数就是将 Generator 函数的星号（*）替换成 async，将 yield 替换成 await，仅此而已。

对此并不十分赞同。async/await 并不是生成器函数和 yield 的替代，而是它们与某种特定的执行器加在一起的替代。而生成器函数的执行器不同，运行效果是完全不一样的。比如星号函数配合用 es6-promise-pool 或者 Promise.all() 实现的执行器可以实现多个 yield 操作的并发执行，这与 async 函数中 await 要做的事情完全不同（await 恰恰就是要等待本次调用的运行结果出来后再进行下次调用，而不是让其与下次调用同时发生）。

比如下面这个例子（字数太多只能外链）：
https://gist.github.com/SwimmingTiger/742aa221bb3a7eb61664a06f48960d71

输出是这样的：
begin: spawn1 sleep 2000ms, 0:49:50
begin: spawn2 sleep 2000ms, 0:49:50
begin: spawn2 sleep 3000ms, 0:49:50
begin: asyncFunc sleep 2000ms, 0:49:50
end: spawn1 slept 2000ms, 0:49:52
begin: spawn1 sleep 3000ms, 0:49:52
end: spawn2 slept 2000ms, 0:49:52
end: asyncFunc slept 2000ms, 0:49:52
begin: asyncFunc sleep 3000ms, 0:49:52
end: spawn2 slept 3000ms, 0:49:53
end: spawn1 slept 3000ms, 0:49:55
end: asyncFunc slept 3000ms, 0:49:55

可以看出，spawn2 的两个 sleep 是同一时间开始执行的，但是 spawn1 和 asyncFunc 的第二个 sleep 是等到第一个 sleep 执行完成后才开始执行的。

所以在这个例子中，async/await 并不等价于生成器函数 gen，而是等价于生成器函数 gen 和 spawn1 这个特定执行器的结合。

感谢回答，大概看的明白，但是还是不知道要怎么实现，让log语句在asyncReadFile执行完成后才打印出result的值。
比如小程序中的wx.getStorageSync()就是这样
var result = fetchData();
console.log(result);

阮老师你好：看了您对
《async 函数的 await 命令后面，可以跟 Promise 对象和原始类型的值（数值、字符串和布尔值，但这时等同于同步操作）。》
的解读我有一点疑惑。昨天看MDN Web DOC上的说法是这样的《await 只在异步函数里面才起作用。它可以放在任何异步的，基于 promise 的函数之前。》

那么await后面可跟的表达式到底有什么限制吗？望您抽空解答，谢谢

接普通非promise 对象直接返回运算值；

接promise 对象，等着 Promise 对象 resolve，然后得到 resolve 的值，作为 await 表达式的运算结果