async 及 await 的特点，它们的优点和缺点分别是什么？await 原理是什么？

一个函数如果加上async，那么该函数就会返回一个Promise

async function test() {
  return "1"
}
console.log(test()) // -> Promise {<resolved>: "1"}

async就是将函数返回值使用Promise.resolve()包裹了下，和then中处理返回值一样，并且await只能配套async使用

async function test() {
  let value = await sleep()
}

async和await可以说是异步终极解决方案了，相比直接使用Promise来说，优势在于处理then的调用链，能够更清晰准确的写出代码，毕竟写一大堆then也很恶心，并且也能优雅地解决回调地狱问题。当然也存在一些缺点，因为await将异步代码改造成了同步代码，如果多个异步代码没有依赖性却使用了await会导致性能上的降低。

async function test() {
  // 以下代码没有依赖性的话，完全可以使用 Promise.all 的方式
  // 如果有依赖性的话，其实就是解决回调地狱的例子了
  await fetch(url)
  await fetch(url1)
  await fetch(url2)
}

下面来看一个使用await的例子：

let a = 0
let b = async () => {
  a = a + await 10
  console.log('2', a) // -> '2' 10
}
b()
a++
console.log('1', a) // -> '1' 1

对于以上代码你可能会有疑惑，让我来解释下原因

• 首先函数b先执行，在执行到await 10之前变量a还是 0，因为await内部实现了generator，generator会保留堆栈中东西，所以这时候a = 0被保存了下来
• 因为await是异步操作，后来的表达式不返回Promise的话，就会包装成Promise.reslove(返回值)，然后会去执行函数外的同步代码
• 同步代码执行完毕后开始执行异步代码，将保存下来的值拿出来使用，这时候a = 0 + 10

上述解释中提到了await内部实现了generator，其实await就是generator加上Promise的语法糖，且内部实现了自动执行generator。如果你熟悉 co 的话，其实自己就可以实现这样的语法糖。