小程序之纯粹callback回调、promise和async、await区别以及用法

纯粹callBack和promise区别

1、纯粹的callBack回调因为剥夺了函数的回调能力，所以当函数的调用层数很多的时候，需要层层传递callBack

2、promise不需要层层传递callBack，因为它使函数具备了return的能力

3、对于多个异步需要合并的情况下，用纯粹的callback 是相当麻烦的，但是promise很好的解决这个问题

4、promise是一个对象，不同于函数，对象能保留状态，而函数在被调用需要马上返回状态（闭包函数除外）

 

promise基础用法

1、new 一个promise对象

2、异步代码写在promise的函数中

3、promise接受两个参数，一个resolve(已成功)，一个reject(已失败)

4、promise有三种状态pendding(进行中，当new了promise就是pendding的状态)、fulfilled(已成功)、rejected(已失败)，当成功的时候调用resolve将状态改为已成功，当失败的时候调用reject将状态改为已失败，一旦状态发生改变之后，状态就凝固了，后面就无法改变状态了，成功会将成功的数据返回，失败会将失败的信息返回。

5、在需要获取数据的地方通过promise.then()的方式获取，这里面接受两个参数，都是匿名函数，第一个是接受成功的函数，第二个是失败时候的函数

const promise = new Promise((resolve, reject)=>{
  wx.getSystemInfo({
    success: (res)=>{
      resolve(res)
    },
    fail: (error)=>{
      reject(error)
    }
  })
});

promise.then((res)=>{
  //获取成功的结果，res中存着获取成功时的数据
  console.log(res)
},(error)=>{
  // 获取数据失败时
  console.log(error)
})

6、es6的写法，如果函数只有一个参数的话，括号不需要，如果括号中只有一行代码，花括号可以不需要

promise.then((res)=>{
  //获取成功的结果，res中存着获取成功时的数据
  console.log(res)
},(error)=>{
  // 获取数据失败时
  console.log(error)
})

const promise1 = new Promise((resolve, reject)=>{
  wx.getSystemInfo({
    success: res=> resolve(res),
    fail: error=> reject(error)
  })
});

promise1.then(
  res=> console.log(res),
  error=> console.log(error)
)

 

promise多异步任务合并用法（promise.all promise.race）

promise.all 是多有的请求全部返回才能回调

promise.race 是多个请求中只要有一个请求完成回调即返回，返回的是最先回调的结果

onLoad: function (options) {
    wx.showLoading();
    const bid = options.bid
    const detail = bookModel.getDetail(bid);
    const comments = bookModel.getComments(bid);
    const likeStatus = bookModel.getLikeStatus(bid)
    // Promise.all 要等所有请求全部返回才能回调 还有一个 .race 只要有一个子请求完成就回调，回调的是竞争成功的回调结果也就是完成的
    Promise.all([detail, comments, likeStatus])
    .then(res=>{
      this.setData({
        book: res[0],
        comments: res[1].comments,
        likeStatus: res[2].like_status,
        likeCount: res[2].fav_nums
      })
      wx.hideLoading()
    })
  }

 

async、await基础用法

1、async和await使得异步请求操作变得  “同步化”，其使得异步和同步一样直接返回一个结果，返回的成功失败，数据的获取直接从保存结果的变量中去判断以及取结果

2、async和await一般成对出现，任何一个离开了，另外一个都活不下去

3、async和await的使用，是基于promise，并且async返回的也是一个promise对象

timeout(ms){
    return new Promise(resolve=>{
      setTimeout(resolve, ms)
    })
  }

  async asyncPrint(){
    await this.timeout(123)
    console.log(11)
  }