async/await简介

WTF!!!

ECMAScript 7 发布,竟然没有async/await[懵逼脸]。相较于generator,我更偏爱于async/await,我为此还将所有的promise.thengenerator全改为async/await[再次懵逼]。

什么是async/await?

async/await被定义在这个仓库中,相较于generator,我们利用async/await可以以看起来更为同步的方式写出异步代码,且可读性更高。比如:

// 一个异步操作
const asyncOp = () => new Promise((resolve, reject) => {
  console.log(2)
  setTimeout(resolve(true), 3000)
})

// async/await 方式
const asyncFun = async () => {
  console.log(1)
  const result = await asyncOp()
  console.log(result)
  console.log(3)
}

asyncFun()

// output
// 1
// 2
// true
// 3

从上面可以看出async/await的存在使得你可以等待await一个Promise的完成。这将以非阻塞的方式暂停这个函数的进行,并且等待Promise的resolve函数的执行并返回结果。如果Promise抛出异常,你可以通过catch去处理这个异常。

而如果我们用generator的方式去写这部分异步操作我们会怎么写呢,请看代码:

// generator 方式
function* asyncFun () {
  console.log(1)
  yield asyncOp()
  console.log(3)
}

const demo = asyncFun()
const ret = demo.next().value
console.log(ret)
demo.next()
// output
// 1
// 2
// Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: true}
// 3

我承认,我的写法需要改善,但是我真的不喜欢这种写法[这不是偏见!!!],而且当yield之后返回的就是一个Promise,你还需要其他做一些其他操作再得到这个确切的返回结果。

总之就是喜欢async/await,没有理由!

文章均采用 CC BY-NC-SA 3.0 许可协议,转载请注明出处。
本文链接:https://blog.kingsongao.com/2016/07/17/async-await简介/