Promise对象的状态改变,只有两种可能:从pending变为fulfilled和从pending变为rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果,这时就称为 resolved(已定型)。如果改变已经发生了,你再对Promise对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。

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

 var p=Promise.all([p1,p2,p3]);

(1)只有p1、p2、p3的状态都变成fulfilled,p的状态才会变成fulfilled,此时p1、p2、p3的返回值组成一个数组,传递给p的回调函数。

(2)只要p1、p2、p3之中有一个被rejected,p的状态就变成rejected,此时第一个被reject的实例的返回值,会传递给p的回调函数。

promise.all()

比如当数组里的P1,P2都执行完成时,页面才显示。
值得注意的是,返回的数组结果顺序不会改变,即使P2的返回要比P1的返回快,顺序依然是P1, P2

Promise.all成功返回成功数组,失败返回失败数据,一但失败就不会继续往下走

let p1 = new Promise((resolve, reject) => {  resolve('成功了')})let p2 = new Promise((resolve, reject) => {  resolve('success')})let p3 = Promse.reject('失败')Promise.all([p1, p2]).then((result) => {  console.log(result)               //['成功了', 'success']}).catch((error) => {  console.log(error)})Promise.all([p1,p3,p2]).then((result) => {  console.log(result)}).catch((error) => {  console.log(error)      // 失败了,打出 '失败'})
let wake = (time) => {  return new Promise((resolve, reject) => {    setTimeout(() => {      resolve(`${time / 1000}秒后醒来`)    }, time)  })}let p1 = wake(3000)let p2 = wake(2000)Promise.all([p1, p2]).then((result) => {  console.log(result)       // [ '3秒后醒来', '2秒后醒来' ]}).catch((error) => {  console.log(error)})需要特别注意的是,Promise.all获得的成功结果的数组里面的数据顺序和Promise.all接收到的数组顺序是一致的,即p1的结果在前,即便p1的结果获取的比p2要晚。这带来了一个绝大的好处:在前端开发请求数据的过程中,偶尔会遇到发送多个请求并根据请求顺序获取和使用数据的场景,使用Promise.all毫无疑问可以解决这个问题。
注意:如果作为参数的 Promise 实例,自己定义了catch方法,那么它一旦被rejected,并不会触发Promise.all()的catch方法。示例代码:const p1 = new Promise((resolve, reject) => {  resolve('hello');}).then(result => result).catch(e => e);const p2 = new Promise((resolve, reject) => {  throw new Error('报错了');}).then(result => result).catch(e => e);Promise.all([p1, p2]).then(result => console.log(result)).catch(e => console.log(e));// ["hello", Error: 报错了]p1会resolved,p2首先会rejected,但是p2有自己的catch方法,该方法返回的是一个新的 Promise 实例,p2指向的实际上是这个实例。该实例执行完catch方法后,也会变成resolved,导致Promise.all()方法参数里面的两个实例都会resolved,因此会调用then方法指定的回调函数,而不会调用catch方法指定的回调函数。而如果p2没有自己的catch方法,就会调用Promise.all()的catch方法。如下:const p1 = new Promise((resolve, reject) => {  resolve('hello');}).then(result => result);const p2 = new Promise((resolve, reject) => {  throw new Error('报错了');}).then(result => result);Promise.all([p1, p2]).then(result => console.log(result)).catch(e => console.log(e));// Error: 报错了

promise.race( )

Promise.race是赛跑的意思,也就是说Promise.race([p1, p2, p3])里面的结果哪个获取的快,就返回哪个结果,不管结果本身是成功还是失败

使用场景: Promise.all和Promise.race都是有使用场景的。 有些时候我们做一个操作可能得同时需要不同的接口返回的数据,这时我们就可以使用Promise.all; 有时我们比如说有好几个服务器的好几个接口都提供同样的服务,我们不知道哪个接口更快,就可以使用Promise.race,哪个接口的数据先回来我们就用哪个接口的数据

let p1 = new Promise((resolve, reject) => {  setTimeout(() => {    resolve('success')  },1000)})let p2 = new Promise((resolve, reject) => {  setTimeout(() => {    reject('failed')  }, 500)})Promise.race([p1, p2]).then((result) => {  console.log(result)}).catch((error) => {  console.log(error)  // 打开的是 'failed'})

下面来看几个简洁易懂的例子:

1.await 可以获得多个promise 的返回结果

2. Promise.all 返回的也是promise,所以可以直接await Promise.all();

1. 使用Promise

function fn(){  return new Promise((resolve,reject)=>{    let randomNum = parseInt(Math.random()*6+1);    console.log(randomNum);    if(randomNum>3){      resolve('买');    }    else{      reject('不买');    }  })}Promise.all([fn(),fn()]).then(  (x)=>{console.log(x,'success')},(y)=>{console.log(y,'error');});

Promise.all 里面参数为一个数组,数组的每一项是一个返回promise 的函数调用
then 的第一个参数是所有promise都成功的调用,返回结果是一个数组,数组的每一项为函数promise 的返回结果。
then 的第二个参数:返回结果有一个失败则执行失败的回调,拿到的是第一个失败的值
2. 使用await

await 是可以获得多个promise 返回结果的,Promise.all()返回的也是promise结果。所以想要使用await 拿到多个promise的返回值,可以直接await Promise.all();

function fn(){  return new Promise((resolve,reject)=>{    let randomNum = parseInt(Math.random()*6+1);    console.log(randomNum);    if(randomNum>3){      resolve('买');    }    else{      reject('不买');    }  })}async function test(){  try{  let res = await Promise.all([fn(),fn()]);  console.log(res,'success');  }  catch(error){    console.log(error,'error');  }}test();

Promise.all([fn(),fn()]) 都返回resolve(); 才能够拿到成功的返回值
Promise.all([fn(),fn()]) 有一个返回reject(), 则进入catch(error), 拿到失败的返回值