• promise 和 async 的用法


    promise

    // 先构造一个 promise 函数
    // resolve 和 reject 都是一个函数
    // resolve 在成功时调用
    // reject 在失败时调用
    function promise() {
      return new Promise((resolve, reject) => {
        let tar = Math.random(0, 1)
        if (tar > 0.5) {
          console.log('suceess')
          setTimeout(function() {
            resolve('resolve')  
          }, 1000)
        } else {
          console.log('fail')
          setTimeout(function() {
            reject('reject')
          }, 1000)
        }
      })
    }
    
    // then 和 catch 第一个参数为resolve状态时的回调,第二个参数为reject状态时的回调
    // catch 相当于 then(null, reject)
    promise().then(
      (resolve) => console.log('then', resolve)
    ).catch(
      (reject) => console.log('catch', reject)
    )
    
    
    // then 后面还可以接 then 一直链式调用
    // 第一个 then 接受的参数是 resolve 函数传过来的参数
    // 第二个 then 接受一个参数是第一个 then 返回的值
    promise().then(
      (resolve) => (resolve + 1)  // 接受 resolve 返回 resolve + 1
    ).then(
      (plusOne) => console.log(plusOne)  // 接受 resolve +1 并打印
    ).catch(
      (reject) => console.log('catch', reject)
    )
    

    async

    // 同样需要一个 promise 对象
    function promise() {
      return new Promise((resolve, reject) => {
        let tar = Math.random(0, 1)
        if (tar > 0.5) {
          console.log('success')
          setTimeout(function() {
            resolve('resolve')
          }, 1000)
        } else {
          console.log('fail')
          setTimeout(function() {
            reject('reject')
          }, 1000)
        }
      })
    }
    
    // 只是调用的方法跟 then/catch 不一样
    // async 函数执行时,一旦遇到 await 就会先返回,等异步操作完成,再接着执行后面的操作
    async function async() {
      const res = await promise()
      console.log(res)
      console.log('wait')
      return res
    }
    
    // async 函数返回 promise 对象
    // 只有函数内的 await 语句全部执行完,或者遇到 return 或 抛出错误,才会发生状态改变
    // 如果发生错误或状态为 reject 则执行 catch
    async().then(
      (res) => console.log(res)
    ).catch(
      (e) => console.log(e)
    )
    
  • 相关阅读:
    初心不负 笔记-JS高级程序设计-引用类型篇-Array
    CSS-样式篇
    笔记-JS高级程序设计-变量,作用域和内存问题
    笔记-JS高级程序设计-基本概念篇
    WPF 10天修炼 第四天- WPF布局容器
    WPF 10天修炼 第三天- Application全局应用程序类
    WPF 10天修炼 第二天- XAML语言
    WPF 10天修炼 第一天- 入门
    C# 关于e.Handled 的说明
    C# Replace方法
  • 原文地址:https://www.cnblogs.com/chaohangz/p/7741765.html
Copyright © 2020-2023  润新知