async和await

一个函数若是加上 async ,那么该函数就会返回一个 Promise并发

async function test() {
  return "1";
}
console.log(test()); // -> Promise {<resolved>: "1"}
能够把 async 当作将函数返回值使用 Promise.resolve() 包裹了下。

await 只能在 async 函数中使用

function sleep() {
  return new Promise(resolve => {
    setTimeout(() => {
      console.log('finish')
      resolve("sleep");
    }, 2000);
  });
}
async function test() {
  let value = await sleep();
  console.log("object");
}
test()

上面代码会先打印 finish 而后再打印 object 。由于 await 会等待 sleep 函数 resolve ,因此即便后面是同步代码,也不会先去执行同步代码再来执行异步代码。异步

async 和 await 相比直接使用 Promise 来讲,优点在于处理 then 的调用链,可以更清晰准确的写出代码。缺点在于滥用 await 可能会致使性能问题,由于 await 会阻塞代码,也许以后的异步代码并不依赖于前者,但仍然须要等待前者完成,致使代码失去了并发性。async

下面来看一个使用 await 的代码。函数

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

对于以上代码你可能会有疑惑,这里说明下原理性能

首先函数 b 先执行,在执行到 await 10 以前变量 a 仍是 0,由于在 await 内部实现了 generators ,generators 会保留堆栈中东西,因此这时候 a = 0 被保存了下来
由于 await 是异步操做,遇到await就会当即返回一个pending状态的Promise对象,暂时返回执行代码的控制权,使得函数外的代码得以继续执行,因此会先执行 console.log('1', a)
这时候同步代码执行完毕,开始执行异步代码,将保存下来的值拿出来使用,这时候 a = 10
而后后面就是常规执行代码了code

相关文章
相关标签/搜索