ES6 async 与 await 怎么使用（基础）

首先，这两个词语可以理解为修饰符。那么它们是什么关系？有什么作用？应该怎么样用？

async和await关键字让我们可以用一种更简洁的方式写出基于Promise的异步行为，而无需刻意地链式调用promise。食用本篇文章之前建议先去看一下promise！

async

async修饰符是是使用async函数的声明修饰符。也就是说你在普通的函数前面加async关键字，就可以让这个函数的结果变成一个promise函数：

async function fn1() {}
const a = fn1()
console.log(a);

 a打印结果为：

await

await操作符用于等待一个Promise 对象。它只能在被async修饰的异步函数中使用，但是async函数中可以没有await关键字。通俗来讲就是跟这个单词一样，等待！当函数执行到这个地方的时候会被暂停掉，直到这个拿到这个返回值的时候，继续执行。

当await右侧为

• promise时：返回结果为promise处理的结果；
• 非promise时：将此值作为返回值。

应用实例

let p1 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('ok')
  }, 1000);
})

let p2 = new Promise((resolve, reject) => {
  reject('fail')
})

async function main() {
  //1.非promise
  let res1 = await 10
  console.log('res1:', res1);

  //2.promise对象,成功
  let res2 = await p1
  console.log('res2:', res2);

  //3.promise对象，失败（需要try catch 抛出异常）
  try {
    let res3 = await p2
    console.log('res3:', res3);
  } catch (e) {
    console.log('异常抛出:', e);
  }

}

main()

输出结果：

 但是如果在前面的promise函数处理过异常之后，就不用try...catch。因为这个时候是会拿到返回值的，如果没有return返回值即为undefined，有返回值即以返回值为准。

例如在p2处加上异常处理，且指定返回1（其余不变）：

let p2 = new Promise((resolve, reject) => {
  reject('fail')
}).catch(() => {
   //未指定返回值为undefined
   return '1'

})

打印结果为：