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命令后面的异步操作,如果不存在继发关系,最好让它们同时触发。

    相关文章

      网友评论

        本文标题:ES6 async 函数

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