【愚公系列】2022年09月 微信小程序-promise详解

文章目录

• 前言
• 一、promise详解
  • 1.普通的request请求
  • 2.promise的request请求
  • 3.第三方库实现小程序的所有API的promise化

---

前言

Promise 其实是异步编程的一种解决方案，主要为了解决地狱回调得问题，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。

从语法上说，Promise 是一个对象，可以从改对象获取异步操作的消息。

promise有3种状态：

pending（待解决，这也是初始化状态）

fulfilled（完成）

rejected（拒绝）

promise主要是同过then来接收数据的，主要包含以下方法

all：如果有一个promise实例的状态是rejected，则新的promise实例的状态就是rejected，返回第一个promise reject的reason

any：如果有一个promise实例的状态是rejected，则新的promise实例的状态就是rejected，返回第一个promise reject的reason

race：返回最先执行结束的promise的value或者reason，不论状态是rejected还是fulfilled

一、promise详解

1.普通的request请求

代码语言：javascript复制

wx.request({
  url: '',
  method: '',
  data: {},
  success: (res) => {
    console.log(res);
  },
  fail: (res) => {
    console.log(res);
  },
  complete: (res) => {
    console.log(res);
  }
})

2.promise的request请求

封装

代码语言：javascript复制

requestPromise(url, method) {
  return new Promise((resolve, reject) => {
    wx.request({
      url,
      method,
      success: (res) => {
        resolve(res)
      },
      fail: (res) => {
        reject(res)
      }
    })
  })
}

使用

代码语言：javascript复制

async getRequest() {
    try{
          const res = await this.requestPromise('API', '方法')
          console.log(res);
     }catch(err){
           console.log(err);
     }
}

3.第三方库实现小程序的所有API的promise化

安装如下包

代码语言：javascript复制

npm i --save miniprogram-api-promise

在微信开发者工具中构建npm包就可以引入了，具体使用方式如下：

代码语言：javascript复制

//1.在小程序入口文件中调用一次 promisifyAll()方法
import { promisifyAll } from 'miniprogram-api-promise'
//2.声明一个常量，为一个空对象
const wxp = wx.p = {}
//3.调用 promisifyAll()方法
promisifyAll(wx, wxp)

我们在全局对象上定义一个wxp指向同一个空对象

promisifyAll : 做的事就是将 wx 拥有的属性方法都 copy 并改造了一份给了 wxp这个对象

这样wxp和wx就都指向了同一个对象

代码语言：javascript复制

//使用
async request2 () {
  const { data: res } = await wxp.request({
    url: 'API',
    method: 'GET',
  })
  // res 处理
  console.log(res)
}

http 小程序 api javascript node.js

0 人点赞