一、promise.all的用法

promise.all的作用就是把多个promise实例包装成一个新的promise实例，同时，成功和失败的返回是不同的，成功的时候返回的是一个数组，而失败的时候返回的是最先被reject的失败状态的值。

代码演示

var p1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 500, "p1");
});

var p2 = new Promise((resolve, reject) => {
  setTimeout(resolve, 600, "p2");
});

Promise.all([p1, p2]).then((res) => {
  // 第三步的代码需要p1\p2的支持
  console.log(res)               //["p1", "p2"]
}).catch((error) => {
  console.log(error)
})

Promse.all在处理多个异步处理时非常有用，比如说一个页面上需要等两个或多个ajax的数据回来以后才正常显示，在此之前只显示loading图标。

代码演示

var p1 = function yan() {
  return new Promise((resolve, reject) => {
    let str = Math.floor(Math.random() * 6 + 1);
    setTimeout(() => {
      resolve(str);
    }, 1000);
  });
}
var p2 = function second() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("我是sceond");
    }, 1000);
  });
}
Promise.all([p1, p2]).then((res) => {
  console.log(res)               //[返回一个随机数, "我是sceond"]
}).catch((error) => {
  console.log(error)
})

需要特别注意的是，Promise.all获得的成功结果的数组里面的数据顺序和Promise.all接收到的数组顺序是一致的，即p1的结果在前，即便p1的结果获取的比p2要晚。这带来了一个绝大的好处：在前端开发请求数据的过程中，偶尔会遇到发送多个请求并根据请求顺序获取和使用数据的场景，使用Promise.all毫无疑问可以解决这个问题。

其中，还可以使用async和await来实现几个数据的执行，await就相当于promise.then()

代码演示

function yan() {
  return new Promise((resolve, reject) => {
    let str = Math.floor(Math.random() * 6 + 1);
    setTimeout(() => {
      resolve(str);
    }, 1000);
  });
}
function second() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("我是sceond");
    }, 1000);
  });
}

async function text() {
  let n = await yan();
  let s = await second();
  console.log(n, 11111);    //6 11111
  console.log(s, 222222);   //我是sceond 222222
}

text();

可以使用这样的方式来代替promise.all，不过这种我不知道效果怎么，能用promise.all就用promise.all

async 和awiat 搭配使用 让方法 同步执行 方法就是按照程序的书写顺序依次执行的

二、promise.race的使用

race有赛跑的意思，所以说，Promse.race就是赛跑的意思，意思就是，谁的数据获取的快，就获取谁的结果，不管他是成功还是失败的状态，简单来说，就是谁的数据拿到的最快，就返回谁的数据。

var p3 = new Promise((resolve, reject) => {
  setTimeout(resolve, 500, "p3");
});

var p4 = new Promise((resolve, reject) => {
  setTimeout(resolve, 600, "p4");
});

Promise.race([p3, p4]).then((res) => {
  console.log(res); //  "p3"
}) .catch((err) => {
    console.log(err);   /如果失败走这个
});

这个的话就是在公司中，如果同时获取几个接口，但是有的接口不稳点,所以可以使用promise.race这个对象方法

三、promise的三种状态

fulfilled 为成功的状态，

代码演示

const p2 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve();
  });
});
console.log("p2", p2);

rejected 为失败的状态，

代码演示

const p3 = new Promise((resolve, reject) => {
  setTimeout(() => {
    reject();
  });
});
console.log("p3", p3);

pending 既不是 fulfilld 也不是 rejected 的状态，可以理解为 Promise 对象实例创建时候的初始状态

代码演示

const p1 = new Promise((resolve, reject) => {});
console.log("p1", p1);

四、promise的实例方法

promise.then()：获取异步任务的正常结果。
promise.catch()：获取异步任务的异常结果。
promise.finaly()：异步任务无论成功与否，都会执行。

五、promise的对象方法

promise.all (): 并发处理多个异步任务，所有任务都执行成功，才能得到结果
promise.race (): 并发处理多个异步任务，只要有一个任务执行成功，就能得到结果