Promise

特点

• 对象的状态不受外界影响。Promise对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。这也是Promise这个名字的由来，它的英语意思就是“承诺”，表示其他手段无法改变。
• 一旦状态改变，就不会再变，任何时候都可以得到这个结果。Promise对象的状态改变，只有两种可能：从pending变为fulfilled和从pending变为rejected。只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果，这时就称为 resolved（已定型）。如果改变已经发生了，你再对Promise对象添加回调函数，也会立即得到这个结果。这与事件（Event）完全不同，事件的特点是，如果你错过了它，再去监听，是得不到结果的。

基本用法

    let p1 = new Promise((resolve,reject)=>{
        let num = Math.round(Math.random())
        if(num<0.5){
            resolve(100)
        }else{
            reject(200)
        }
    })
    p1.then(res=>{
        console.log(res)  // 如果num小于0.5，就会输出100
    }).catch(err=>{
        console.log(err)  // 如果num大于0.5，就会输出200
    })

Promise构造函数接受一个函数作为参数，该函数的两个参数分别是resolve和reject。它们是两个函数，由 JavaScript 引擎提供，不用自己部署。

resolve函数的作用是，将Promise对象的状态从“未完成”变为“成功”（即从 pending 变为 resolved），在异步操作成功时调用，并将异步操作的结果，作为参数传递出去；reject函数的作用是，将Promise对象的状态从“未完成”变为“失败”（即从 pending 变为 rejected），在异步操作失败时调用，并将异步操作报出的错误，作为参数传递出去。

Promise实例生成以后，可以用then方法分别指定resolved状态和rejected状态的回调函数。

Promise中的同步异步

let p1 = new Promise((resolve,reject)=>{
        console.log(1)
        resolve()
        setTimeout(()=>{
            console.log(2)
        },1000)
    })
    p1.then(res=>{
        console.log(3)
    })
    console.log(4)
// 1 4 3 2 

Promise本身是同步的，但是它的then方法是异步的

Promise.prototype.then()

then 方法可以有两个参数，第一个参数是resolve状态的回调函数，第二个参数(可选)是reject状态的回调函数
then方法返回一个新的Primise实例(注意，不是原来那个Promise实例)。因此可以采用链式写法，即then方法后面再调用另一个then方法。

  let p1 = new Promise((resolve,reject)=>{
        resolve(100)
    })
    p1.then(res=>{
        console.log(res)  // 100
        return res
    }).then(res=>{
        console.log(res)  // 100
    })

上面的代码使用then方法，依次指定了两个回调函数。第一个回调函数完成以后，会将返回结果作为参数，传入第二个回调函数。

let p1 = new Promise((resolve,reject)=>{
        resolve(100)
    })
    p1.then(res=>{
        console.log(res)  // 100
        return new Promise((resolve,reject)=>{
            resolve(200)
        })
    }).then(res=>{
        console.log(res)  // 200
    })

上面代码中，第一个then方法指定的回调函数，返回的是另一个Promise对象。这时，第二个then方法指定的回调函数，就会等待这个新的Promise对象状态发生变化。

Promise.prototype.catch()

let p1 = new Promise((resolve,reject)=>{
    throw new Error('错误信息');
   })
   p1.then(res=>{
    console.log(res)
   })
   .catch(err=>{
    console.log(err) // 报错=>错误信息
   })

上面代码中，promise内部抛出一个错误，这是就会执行.catch方法

    let p1 = new Promise((resolve,reject)=>{
        resolve(11)
            throw new Error('错误信息');
    })
    p1.then(res=>{
            console.log(res) // 11 
    })
    .catch(err=>{
            console.log(err)
    })

上面代码中，Promise 在resolve语句后面，再抛出错误，不会被捕获，等于没有抛出。因为 Promise 的状态一旦改变，就永久保持该状态，不会再变了。

Promise.prototype.finally()

finally方法用于指定不管 Promise 对象最后状态如何，都会执行的操作。该方法是 ES2018 引入标准的。

 let p1 = new Promise((resolve,reject)=>{
        resolve(11)
    })
    p1.then(res=>{
            console.log(res) // 11 
    })
    .catch(err=>{
            console.log(err)
    })
    .finally(e=>{
        console.log(000) // 000
    })

上面代码中，不管promise最后的状态，在执行完then或catch指定的回调函数以后，都会执行finally方法指定的回调函数。

Promise.all()

let p1 = new Promise((resolve,reject)=>{
        resolve(100)
    })
    let p2 = new Promise((resolve,reject)=>{
        resolve(200)
    })
    const p3 = Promise.all([p1,p2])
    p3.then(res=>{
        console.log(res) // [100, 200]
    })

上面代码中Promise.all方法接受一个数组作为参数，p1,p2都是Promise实例，如果不是，就会调用Promise.resolve方法，将参数转为Promise实例，在进一步处理

• p3的状态由p1,p2决定，分两种情况
  • 只有p1,p2的状态都变成fulfilled，p3的状态才会变成fulfilled，此时p1，p2的返回值组成一个数组，传递给p3的回调函数
  • 只要p1，p2之中有一个被rejected，p3的状态就会变成rejected，此时第一个被rejcet的实例的返回值，会传递给p3的回调函数

下面看一个例子

    let p1 = new Promise((resolve,reject)=>{
        reject(100)
    })
    let p2 = new Promise((resolve,reject)=>{
        resolve(200)
    })
    const p3 = Promise.all([p1,p2])
    p3.then(res=>{
        console.log(res)
    }).catch(err=>{
        console.log(err)  // 100
    })

上面代码就是上面说到的第二种情况

Promise.race()

let p1 = new Promise((resolve,reject)=>{
        setTimeout(()=>{
            resolve(100)
        },2000)
        
    })
    let p2 = new Promise((resolve,reject)=>{
        setTimeout(()=>{
            resolve(200)
        },1000)
    })
    const p3 = Promise.race([p1,p2])
    p3.then(res=>{
        console.log(res)  // 200
    })

上面代码中，只要p1、p2之中有一个实例率先改变状态，p3的状态就跟着改变。那个率先改变的 Promise 实例的返回值，就传递给p3的回调函数。