一、

当有异步操作时,一般会使用Promise对其进行封装

new Promise((resolve,reject)=>{
    // 进行网络请求,

    // 成功时调用resolve()
    resolve(data); // 假设server返回数据data       

    // 失败时调用reject()
    reject('network disconnect');

}).then(data => {
    console.log(data);
}).catch(err => {
    console.error(err);
})

二、Promise 的三种状态

pending: 等待状态。如正在进行网络请求，或定时器未到时间
fulfilled: 完成状态。当主动调用resolve()时即会处于该状态，并回调then()
rejected: 拒绝状态。当主动调用reject()时即会处于该状态，并回调catch()

tips
对象的状态不受外界影响，只有异步操作的结果能够决定当前是哪一种状态
一旦状态改变（从pending变为fulfilled和从pending变为rejected），就不会再变，任何时候都可以得到这个结果

三、实例方法

• then()
• catch()
• finally()

then是实例状态发生改变时的回调函数，
第一个参数是resolved状态的回调函数，第二个参数是rejected状态的回调函数
then方法返回的是一个新的Promise实例。

Promise对象的错误具有“冒泡”性质，会一直向后传递，直到被捕获为止,
一般来说，使用catch方法代替then()第二个参数。

finally()方法用于指定不管 Promise 对象最后状态如何，都会执行的操作

示例

new Promise ((resolve, reject)=>{
      // 进行网络请求,
      resolve(data);
      reject('error');
}).then(data => {
   // 成功时,处理data
},err =>{
    // 失败时,打印错误
    console.error(err);
})

四、构造函数方法

• all()
• race()
• allSettled()

  all()

Promise.all()方法用于将多个 Promise实例，包装成一个新的 Promise实例

const p = Promise.all([p1, p2, p3])
接受一个数组（迭代对象）作为参数，数组成员都应为Promise实例

实例p的状态由p1、p2、p3决定，分为两种：

只有p1、p2、p3的状态全部 => fulfilled，p的状态才会变成fulfilled，
此时p1、p2、p3的返回值组成一个数组，传递给p的回调函数
只要p1、p2、p3之中有一个 => rejected，p的状态就变成rejected，
此时第一个被reject的实例的返回值，会传递给p的回调函数

应用场景：
通过all()实现多个请求合并在一起，汇总所有请求结果。
比如走进度条时，会加载多个API拉数据，但这些API之间，并没有依赖关系，则可通过all()合并在一起，并发请求，减少用户等待时间。

race()

Promise.race()方法同样是将多个 Promise 实例，包装成一个新的 Promise 实例

const p = Promise.race([p1, p2, p3])
只要p1、p2、p3之中有一个实例率先改变状态，p的状态就跟着改变

第一个改变的 Promise 实例的返回值，会传递给p的回调函数

项目中什么时候会用到呢？
设置一个延时函数，用于给请求计时，通过race()，设置图片请求超时

allSettled()

Promise.allSettled()方法接受一组 Promise 实例作为参数，包装成一个新的 Promise 实例

只有等到所有这些参数实例都返回结果，不管是fulfilled还是rejected，包装实例才会结束

五、多个请求的执行

场景： 请求一和请求二同时返回结果后，在进行处理
tip: jquery举例

Promise.all([
    new Pormise((resolve,reject)=>{
        $.ajax({
            url:'XXX.XX/api/item',
            success: function(data) {
                resolve(data);
            }
        })
    }),
     new Pormise((resolve,reject)=>{
        $.ajax({
            url:'XXX.XX/api/user',
            success: function(data) {
                resolve(data);
            }
        })
    }),
]).then(results => {
    // 当上述两个请求都返回结果后，all会把所有异步操作的结果放进一个数组中传给then
})