Async/await 函数简介

[Hancoson]

自从 ES6 诞生以来，异步编程的方法得到了很大的发展。从 Promise 到 ES7 提案中的 async/await。目前，它仍处于提案阶段，async 函数可以说是目前异步操作最好的解决方案，是对 Generator 函数的升级和改进。那么今天就来具体说说 async/await 函数。

async/await 简介

• async/await 是异步代码的新方式
• async/await 基于 Promise 实现
• async/await 使得异步代码更像同步代码
• await 只能用在 async 函数中，不能用在普通函数中
• await 关键字后面必须跟 Promise 对象
• 函数执行到 await 后，Promise 函数执行完毕，但因为 Promise 内部一般都是异步函数，所以事件循环会一直 wait，直到事件轮询检查到 Promise 有了状态 resolve 或 reject 才重新执行这个函数后面的内容

async/await 用法

async 函数返回一个 Promise 对象，可以使用 then 方法添加回调函数。当函数执行的时候，一旦遇到 await 就会先返回一个 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);

错误处理

• 方法一

  function timeout(ms) {
    return new Promise(resolve => {
      setTimeout(resolve, ms);
    });
  }
  async function asyncPrint(value, ms) {
    await timeout(ms);
    return value
  }
  asyncPrint('hello world', 5000).then(result=> {
    console.log(result);
  }).catch(err=>{
    console.log(err)
  })
  

• 方法二

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

• await 后面紧跟着的最好是一个耗时的操作或者是一个异步操作(当然非耗时的操作也可以的，但是就失去意义了)
• 如果 await 后面的异步操作出错，那么等同于 async 函数返回的 Promise 对象被 reject

async 函数的学习到这里就结束了，但是这并不意味着 async 的用法只有这些，我们在学习了基础以后，更要把它与其他的知识相结合起来，才能写出更可靠更优质的代码！