Promise

一.基础使用

Promise 实例化的时候，传入的参数是一个函数，函数中接收两个参数：

const p = new Promise((resolve,reject)=>{
setTimeout(()=>{
 resolve('123')
 },1000)
}).then(res=>{
 console.log(res) //1秒后打印123
})

传入的 resolve 和 reject 本身都是函数。其作用分别为：

resolve - 把 Promise 的状态从进行中变为成功状态.

reject - 把 Promise 的状态从进行中变为拒绝状态.

Promise的三种状态：

pending ：进行中，表示 Promise 还在执行阶段，没有执行完成。

fulfilled：成功状态，表示 Promise 成功执行完成.

rejected：拒绝状态，表示 Promise 执行被拒绝，也就是失败。

Promise 的状态，只可能是其中一种状态，从进行中变为成功或失败状态之后，状态就固定了，不会再发生改变.

Promise.then

执行 resolve 时，Promise 状态变为 fulfilled ，会执行 .then 方法。then 方法接收的参数也是一个函数，函数中携带一个参数，该参数是 resolve(res) 返回的数据.

const p = new Promise((resolve,reject)=>{
setTimeout(()=>{
 resolve('哎呦喂')
 },1000)
}).then(res=>{
 console.log(res) //1秒后打印哎呦喂
})

Promise.catch

执行 reject 时，Promise 状态从 pending 变为 rejected，会执行 catch 方法，catch 方法接收的也是一个函数，函数中携带一个参数，该参数为 reject(err) 返回的数据.

const p = new Promise((resolve,reject)=>{
 setTimeout(()=>{
  reject('error message')
  },1000)
 }).then(res=>{
  console.log(res)//不执行
 }).catch(err=>{
  console.log('err',err)//1秒后打印 error message
})

二、Promise 链式调用

new Promise((resolve,rejected)=>{
            setTimeout(()=>{
                console.log(1);
                resolve(110)
            },1000)
        }).then((value)=>{
            new Promise((res,rej)=>{
                console.log(2,value);
                res(value)
            }).then((value)=>{
                console.log(3,value);
                return value
            }).then((value)=>{
                console.log(4,value);
                return value
            })
        }).then((value)=>{
            console.log(5,value);
        })

打印结果是：1,2,3,5,4

三、Promise方法

all 方法

Promise.all 方法，提供了并行执行异步操作的能力，并且在所有异步操作完成之后，统一返回所有结果.具体使用如：

Promise.all([
 new Promise(resolve=>resolve('a')),
 new Promise(resolve=>resolve('b')),
]).then(res=>{
 console.log('all',res)//('a' , 'b')
 })

all 接收到的是一个数组，数组长度取决于 Promise 的个数。

一些游戏类的素材比较多的应用，打开网页时，预先加载需要用到的各类资源，所有的都加载完后，再进行页面的初始化.

race方法

Promise.race 用法与 all 一样，只是返回结果不同，它返回的是执行最快的那个 Promise 的结果.

Promise.race([
 new Promise(resolve=>
  setTimeout(()=>{
   resolve('a')
   },100)
  ),
 new Promise(resolve=>
  setTimeout(()=>{
   resolve('a')
   },200)
  ),
 ]).then(res=>{
  console.log('race',res) // 返回 a
})