微信小程序- Promise 以及 async await 使用示例

JavaScript 的回调

在之前的代码中,我们通过云函数的方式获取openid就是使用的回调方式。
而我们要获取回调中的结果再去处理接下来的操作,只能在对应的回调方法里面写
这就是常说的死亡回调

getOpenid() {
   wx.cloud.callFunction({
        name: 'getOpenid',
        success: res => {
          console.log(res.result.openid)
          // 做获取到 openid 的相关操作
        },
        fail: e => {
         // 做获取不到 openid 的相关操作
         console.log("获取openId 失败")
        },
      })
  }
  // 假如上面的代码肯定能获取到 openid
  // 但是不在 success 里面做获取到的操作,
  // 而在外面做,可能会出现 openid 为空的情况

为了解决这种死亡回调,网上提供了一些方案,如 Promise、async 函数等

相关介绍下面的文章:
菜鸟教程:JavaScript Promise 对象
阮一峰:async 函数的含义和用法

下面提供几个示例,仅供参考

Promise 使用

相关介绍在代码中,都比较很容易理解

未捕捉异常:
微信小程序- Promise 以及 async await 使用示例_第1张图片
捕捉异常:
微信小程序- Promise 以及 async await 使用示例_第2张图片
示例代码:


  async testData(){
  	// 正确的结果
    const data = await that.testPromise(3)
    console.log("resolve data:",data)

    // 异常的结果,如果不捕获异常后面的代码将不会被执行到
    const data1 = await that.testPromise(1)
    console.log("resolve data:",data1)
    
    // 异常的结果,捕捉异常
    try{
      const data2 = await that.testPromise(1)
      console.log("reject try data:",data2)
    }catch(e){
      console.log("reject catch data:",e)
    }

	// 通过 promise 的 then catch 获取结果
    that.testPromise(1).then( res =>{
      console.log("reject1 then data:",res)
    }).catch(e =>{
      console.log("reject1 catch data:",e)
    })
   
  },
  
testPromise(number){
    return new Promise((reslove,reject) =>{
      if(number > 1){
        reslove(0)
      }else{
        reject("传入的数据小于1")
      }
    })
  },

参考

  • 菜鸟教程:JavaScript Promise 对象
  • 阮一峰:async 函数的含义和用法

你可能感兴趣的:(小程序之旅,小程序)