async/await使用

快速上手理解

先复制以下这段代码,在粘贴在chrome的控制台console中,按回车键执行

  1. function getSyncTime() {
  2. return new Promise((resolve, reject) => {
  3. try {
  4. let startTime = new Date().getTime()
  5. setTimeout(() => {
  6. let endTime = new Date().getTime()
  7. let data = endTime - startTime
  8. resolve( data )
  9. }, 500)
  10. } catch ( err ) {
  11. reject( err )
  12. }
  13. })
  14. }
  15. async function getSyncData() {
  16. let time = await getSyncTime()
  17. let data = `endTime - startTime = ${time}`
  18. return data
  19. }
  20. async function getData() {
  21. let data = await getSyncData()
  22. console.log( data )
  23. }
  24. getData()

在chrome的console中执行结果如下

async

从上述例子可以看出 async/await 的特点:

  • 可以让异步逻辑用同步写法实现
  • 最底层的await返回需要是Promise对象
  • 可以通过多层 async function 的同步写法代替传统的callback嵌套