ES6学习笔记之async函数

Learning Card

  • async函数是什么
    • generator函数的语法糖,即高级封装
  • 基本用法
    • generator函数的*替换成了asyncyield替换成了await
    • 但是内置执行器,可以直接执行

async函数是什么

  • 一句话,async函数是generator函数的语法糖
  • 所谓语法糖,就是高级封装

我们可以理解,async函数就是generator函数的高级版,它让generator函数写起来更方便了。

async函数的基本用法

既然async函数是generator的高级封装,我们可以结合两者一起来看看它们之间的区别和联系。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
const fs = require('fs');
const readFile = function(fileName) {
return new Promise(function(resolve, reject) {
fs.readFile(fileName, function(err, data) {
if(error) return reject(error);
resolve(data);
})
})
}

//generator函数写法
const gen = function* () {
const f1 = yield readFile('/data1');
const f2 = yield readFile('/data2');
console.log(f1.toString());
console.log(f2.toString());
};

//async函数写法
const asyncReadFile = async function() {
const f1 = await readFile('/data1');
const f2 = await readFile('/data2');
console.log(f1.toString());
console.log(f2.toString());
}

从写法上看,不难发现,async函数只是将generator函数的星号(*)替换成了async,将yield替换成了await

但是async在用法上还是对generator函数有了一些改进:

  1. 内置执行器

    generator函数的执行需要next()来调用,但是async函数自带执行器,即与普通函数一样,直接调用即可

    1
    asyncReadFile()
  2. 语义更明确

    async本身就有异步的含义,await也有等待结果的意思,比*yield意思更明确

  3. 返回值是Promise

    async函数的返回值是Promise对象,也就是说,我们可以用then方法执行下一步操作。