promise,封装请求库

最近写项目是需要封装请求库，用到了promise对象，就积累积累。

promise对象

了解

Promise对象是为JavaScript异步操作的解决方案，充当异步操作与回调函数之间的桥梁，用链式代替层层套娃回调

状态

promise只有三种状态
pending：未完成
fulfilled：成功
rejected：失败
整个过程，只会从pending到fulfilled/rejected，且状态一经发生是不可逆的

实例promise

首先实例一个promise对象看看

  const pro = new Promise((resolve, reject) => {
     if (true) {
          // 内部代码成功的时候，执行 then 的回调函数
          // 成功调用函数的时候传递实参 111
          resolve(111);
        } else {
          // 内部代码失败的时候，执行 catch 的回调函数
          // 失败调用函数的时候传递实参 222
          reject(222);
        }
      });
      console.log("Promise对象", pro);

在__proto__上你会看到它有这三个
补充：promise的.then方法可以传入两个回调：第一个是操作成功的回调函数，第二个是失败的回调函数

p2.then(console.log, console.error);

  pro
        .then(
           // then 的回调函数被 resolve 接收
          // res 接收成功调用的实参
          res => {
            console.log(res);
          }
        )
        // catch 的回调函数被 reject 接收
        .catch(
          // err 接收失败调用的实参
          err => {
            console.log(err);
          }
        )
        // finally 完成，不管成功失败都会执行
        .finally(() => {
          console.log("成功失败都会执行");
        });

请求封装库事例(wx小程序请求为例子)

//  export是可以导出多个
 // export default 只能导出一个
 export const axios = (params) => {
     // params 是传进来的参数
     // export  ES6导出
     return new Promise((resolve, reject) => {
     //wx.request 这个只是微信小程序的
         wx.request({
             ...params,
             // 结构出来
             // 基本路径+请求地址
             url: baseURL + params.url,
             success: (result) => {
                 // 直接返回核心数据，这个随意
                 resolve(result.data.message);
                 // 成功的回调函数
             },
             fail: (error) => {
                 reject();
                 // 失败的回调函数
             },
             complete: () => {}
         });

     })
 };