美文网首页
小程序中异步处理的几种方式对比

小程序中异步处理的几种方式对比

作者: JX灬君 | 来源:发表于2021-10-06 00:19 被阅读0次

异步处理方式

1.异步处理的几种方式

  • 纯粹的异步回调函数callback
  • promise方法
  • (async,await)

2. 纯粹的异步回调函数callback

  • 每次封装都要带上callback
  • 剥夺函数return能力

3. promise方法

  • 可以轻松处理多个异步等待合并

  • 不需要层层传递callback

  • 没有剥夺函数return能力

  • 本质

    • 是一个对象,不是函数
    • 对象可以保存状态,除闭包外的函数,函数执行完都会返回状态
  • 三个状态

    • pending:进行中
    • fulfilled:已成功
    • rejected:已失败
  • 使用

    • 使用步骤:

      • 1-初始化,
      • 2-在promise函数中写异步代码,
      • 3-获取异步数据(成功,失败)
    • 初始化

      const promise = new Promise((resolve, reject) => {
      
      })
      
    • resolve将pending进行中状态修改为fulfilled已成功状态

    • reject将pending进行中状态修改为rejected已失败状态

    • 通过resolve和reject修改了promise状态之后,promise状态就凝固不可再改变

    • 分别获取promsie成功和失败后的数据

      promsie.then((res)=>{
      
      }, (error)=>{
      
      })
      
  • Promise解决回调地狱

    • 什么是回调地狱

      • 链式多层内部嵌套调用,一层接一层
    • Promise解决回调地狱(then -> return -> then -> return -> then)

      • 在promise函数then回调里返回新的Promise函数然后在通过then进行回调

        const hotList = Model.getHotList()
        hotList.then(res => {
          console.log(res)
          return bookModel.getMyBookCount()
        })
        .then(res => {
          return bookModel.getMyBookCount()
        })
        .then(res => {
          console.log(res)
        })
        
    • Promise解决回调地狱的前提是返回的都是Promise对象

    • 如果遇到非Promise对象,需要转换成Promise对象

      • 思路1
      const _promiseTrans = function(func){
          return function(params = {}) {
              new Promsie((resolve, reject) => {
                  const args = Object.assing(params, {
                      success: (res) => {
                resolve(res)
              },
              fail:(error) => {
                reject(error)
              }
                  })
                  func()
              })
          }
      }
      

4.(async await)

  • ES2017提出

  • 理论上是最佳的处理异步的方案

相关文章

网友评论

      本文标题:小程序中异步处理的几种方式对比

      本文链接:https://www.haomeiwen.com/subject/cipgnltx.html