ES6 async 函数

作者: tiancai啊呆 | 来源:发表于2018-05-20 14:12 被阅读27次

是什么

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

  • 不同之处
    1. async函数的执行,与普通函数一模一样,只要一行。不像 Generator 函数,需要调用next方法。
    2. async函数的返回值是 Promise 对象,Generator 函数的返回值是 Iterator 对象。
    3. 语义性更好,async表示函数里有异步操作,await表示紧跟在后面的表达式需要等待结果。

使用

async函数内部return语句返回的值,会成为then方法回调函数的参数。

async function f() {
  return 'hello world';
}

f().then(v => console.log(v))   //hello world

async函数内部抛出错误,会导致返回的 Promise 对象变为reject状态。抛出的错误对象会被catch方法回调函数接收到。

async function f() {
  throw new Error('出错了');
}

f().then(
  v => console.log(v),
  e => console.log(e)      // Error: 出错了
)

只有async函数内部的异步操作执行完,才会执行then方法指定的回调函数。
await命令后面是一个 Promise 对象。如果不是,会被转成一个立即resolve的 Promise 对象。
只要一个await语句后面的 Promise 变为reject,那么整个async函数都会中断执行。为了代码还能继续执行,我们可以将await命令放在try...catch代码块中。

async function f() {
  await Promise.reject('出错了');
  await Promise.resolve('hello world'); // 不会执行
}

f().then(
  v => console.log(v),
  e => console.log(e)          //出错了
)

async function f() {
  try {
    await Promise.reject('出错了');
  } catch(e) {
    console.log(e)     //出错了
  }
  return await Promise.resolve('hello world');
}

f().then(
  v => console.log(v),       //hello world
  e => console.log(e)       
) 

注意点

  • 最好把await命令放在try...catch代码块中。
  • await命令只能用在async函数之中,如果用在普通函数,就会报错。
  • 多个await命令后面的异步操作,如果不存在继发关系,最好让它们同时触发。

相关文章

  • async await

    文档地址async[http://caibaojian.com/es6/async.html] async函数的语...

  • async/await 整理总结

    参考:红宝书 es6入门 async async 函数的实现原理,就是将 Generator 函数和自动执行器,包...

  • 异步的那些事儿,promise

    promise 是es6 的标准函数,主要是解决执行函数当中的回调问题,相对于async,async只是一套解决回...

  • JS新特性

    ES ES5 ES6 箭头函数 Promise Symbol属性 Iterator Generator async...

  • ES6 知识点整理

    ES6 包括 变量、函数、数组、json、字符串、面向对象、promise、generator、async/awa...

  • 一次性搞懂 Promise、async await 与 Gene

    学习 ES6 的时候,经常听到 Promise、async await 与 Generator 用来处理异步函数,...

  • ES6 async/await关键字 (上)

    async关键字 在ES6中,声明异步函数很简单,只需要在function前加上async关键字即可,如下: 那怎...

  • js异步方法里async await setTimeout

    前言: js异步执行的方法有传统的回调函数callback、es6的promise函数、es7的async awa...

  • ES6 async 函数

    是什么 async函数就是将 Generator 函数的星号(*)替换成async,将yield替换成await,...

  • Es6 async 函数

    1、 async函数返回一个 Promise 对象。 2、async函数内部抛出错误,会导致返回的 Promise...

网友评论

    本文标题:ES6 async 函数

    本文链接:https://www.haomeiwen.com/subject/kchadftx.html