背景：
一个页面需要同时校验两个表单，都校验成功之后才能执行发送，同时校验，且同时提示哪里填写出错，所以直接promise.then的链式调用、async await（任何一个await语句后面的 Promise 对象变为reject状态，那么整个async函数都会中断执行）、 和普通的回调函数都无法实现，所以用到了promise.all
Promise.all(iterable) (iterable 可迭代的)，并且只返回一个Promise实例
此实例在 iterable 参数内所有的 promise 都完成（resolved）；如果参数中 promise 有一个失败（rejected），此实例回调失败（reject）
为了清晰展示怎么使用，由于实际项目vue编写且业务复杂，把promise.all 从项目抽离出来简化了一下，以 index.html 简化出来，放到html里面，是为了可以直接浏览器允许，立马展示运行效果
html文件：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Promsie</title> </head> <body> <script> function validate1() { return new Promise((resolve, reject) => { if (this.flag) { setTimeout(() => { resolve('校验1') }, 3000) } else { reject('校验失败') } }) } function validate2() { return new Promise((resolve) => { setTimeout(() => { resolve('校验2') }, 1000) }) } function send() { const promiseList = [this.validate1(), this.validate2()] // Promise.all 全都成功返回，否则error // Promise.allSettled 都执行完之后返回p对象对应的promise结果 例：{reason: "校验失败"status: "rejected"} // Promise.any 当其中的一个 promise 成功，就返回那个成功的promise的值。 // Promise.race 一旦迭代器中的某个promise成功（解决）或拒绝，返回的 promise就会成功（解决）或拒绝 就是谁请求的速度快，先返回谁，无论失败与否 Promise.all(promiseList) .then((res) => { console.log(res) }) .catch(() => console.log('promise--error')) .finally(() => console.log('无论结果怎样，结束了都走这')) } this.send() </script> </body> </html>
注意： promise 执行了.then 又执行了.cantch的原因
Promise会自动捕获内部异常，并交给rejected响应函数处理。
.then函数中如果有异常代码，哪怕编辑器不报错。Promise会自动捕获内部异常,就会造成不仅执行了.then函数又执行了.catch函数的现象。