zoukankan      html  css  js  c++  java
  • ES8 Async 和 Await

    Async 和 Awaiit 是 Promise 的扩展,我们知道 JavaScript 是单线程的,使用 Promise 之后可以使异步操作的书写更简洁,而 Async 使 Promise 像同步操作

    一、Async

    Async 自动将常规函数转换成 Promise,返回值一个 Promise 对象,使用 async 的效果:

    async function f() {
      return 123
    }
    console.log(f())
    // Promise 对象
    async function f() {
      return 123
    }
    f().then(console.log)
    // 123

    可以看出,f() 的返回值有 then 方法(在 JavaScript 中只有原生 Promise 对象拥有 then 方法)

    console.log(f() instanceof Promise) // true

    通过验证,我们知道想获得一个 Promise 对象,可以不用再使用 new Promise 了,可以用 async 来实现

    另外,async 函数显示返回的结果如果不是 Promise,会自动包装成 Promise 对象,也就是说上面的代码等同于:

    async function f() {
      return Promise.resolve(123)
    }

    二、Await

    Await 放置在 Promise 调用之前,强制后面的代码等待,直到 Promise 对象 resolve,得到 resolve 的值作为 await 表达式的运算结果

    未使用 await 的效果:

    async function f() {
      let promise = new Promise((resolve) => {
        setTimeout(() => resolve(123), 1000)
      })
      console.log(promise.then(val => console.log(val)))
      console.log(456)
    }
    
    f()

    输出:

    使用 await 的效果:

    async function f() {
      let promise = new Promise((resolve) => {
        setTimeout(() => resolve(123), 1000)
      })
      console.log(await promise)
      console.log(456)
    }
    
    f()

    输出:

    await 的字面意思为“等待”,它等什么呢?等的是 Promise 的返回结果,上面这段代码由 async 开启一个 Promise 对象,函数内部嵌套了一个 Promise 操作,这个操作需要等待 1 秒才返回“123”的结果,也就是说 await 在拿到这个结果之前不会执行后面的代码,会一直等到拿到这个结果才往后继续执行

    注意:

    • await 后面如果不是 Promise 对象会自动包装成 Promise 对象
    • await 只能在 async 函数内部使用,否则会报错
  • 相关阅读:
    设计模式系列
    Python3 系列之 可变参数和关键字参数
    设计模式系列
    【HANA系列】SAP HANA ODBC error due to mismatch of version
    【FICO系列】SAP FICO FS00修改科目为未清项目管理
    【FIORI系列】SAP OpenUI5 (SAPUI5) js框架简单介绍
    【HANA系列】SAP HANA SQL获取当前日期加若干天后的日期
    【HANA系列】SAP HANA SQL获取本周的周一
    【HANA系列】SAP HANA SQL获取当前日期
    【HANA系列】SAP HANA SQL获取当前日期最后一天
  • 原文地址:https://www.cnblogs.com/Leophen/p/12739789.html
Copyright © 2011-2022 走看看