前端进阶之旅前端进阶之旅
基础篇
进阶篇
高频篇
精选篇
手写篇
原理篇
面经篇
自检篇
每日一题
  • 综合
    • 综合题型
    • 其他问题
    • 设计模式
    • 思维导图
    • 学习路线
  • 前端基础
    • HTTP
    • 浏览器
    • 计算机基础
  • 进阶学习
    • NPM工作流
    • Docker
    • Canvas
    • Node学习指南
    • 前端综合文章
  • 其他
    • Handbook
    • 职场话题
    • CSS可视化
小程序题库
公众号动态
博客动态
开发者导航
基础篇
进阶篇
高频篇
精选篇
手写篇
原理篇
面经篇
自检篇
每日一题
  • 综合
    • 综合题型
    • 其他问题
    • 设计模式
    • 思维导图
    • 学习路线
  • 前端基础
    • HTTP
    • 浏览器
    • 计算机基础
  • 进阶学习
    • NPM工作流
    • Docker
    • Canvas
    • Node学习指南
    • 前端综合文章
  • 其他
    • Handbook
    • 职场话题
    • CSS可视化
小程序题库
公众号动态
博客动态
开发者导航

ES6系列之Async/await

首页
2018-12-21 16:50:43
Front-End
JavaScriptES6

来自一峰ES6教程

# 一、含义

async 函数是什么?一句话,它就是 Generator 函数的语法糖

// 有一个 Generator 函数,依次读取两个文件

const fs = require('fs');

const readFile = function (fileName) {
  return new Promise(function (resolve, reject) {
    fs.readFile(fileName, function(error, data) {
      if (error) return reject(error);
      resolve(data);
    });
  });
};

const gen = function* () {
  const f1 = yield readFile('/etc/fstab');
  const f2 = yield readFile('/etc/shells');
  console.log(f1.toString());
  console.log(f2.toString());
};
@前端进阶之旅: 代码已经复制到剪贴板

上面代码的函数gen可以写成async函数,就是下面这样

const asyncReadFile = async function () {
  const f1 = await readFile('/etc/fstab');
  const f2 = await readFile('/etc/shells');
  console.log(f1.toString());
  console.log(f2.toString());
};
@前端进阶之旅: 代码已经复制到剪贴板

async函数就是将 Generator 函数的星号(*)替换成async,将yield替换成await,仅此而已

async函数对 Generator 函数的改进,体现在以下四点

  1. 内置执行器

Generator 函数的执行必须靠执行器,所以才有了co模块,而async函数自带执行器。也就是说,async函数的执行,与普通函数一模一样,只要一行

asyncReadFile();
fe
  • 一、含义
  • 二、基本用法
  • 三、语法
    • 3.1 返回 Promise 对象
    • 3.2 Promise 对象的状态变化
    • 3.3 await 命令
    • 3.4 错误处理
    • 3.5 使用注意点
  • 四、async 函数的实现原理

← JavaScript深浅拷贝ES6系列之Generator →