关于promise函数的用法，我这样写是对的吗？

Question

如下，我有两个函数，写成了promis 形式

函数一

verifyGA(type){
      let that = this;
      return new Promise((resolve,reject) => {
        that.$post('/user/verifyGA',{
          gaCode:that.gaCode,
          captchaType:type
        }).then(res=>{
          if (!res.code) {
            resolve(true)
          } else {
            reject(res.message)
            that.gaError = res.message;
          }
        })
      })
    },

函数二

checkCode(type){
      let that = this;
      let bind = this.isEmail ? 32:31;
      let Untie = this.isEmail ? 34:33;
      let code_type = type == 1 ? bind:Untie;
      return new Promise((resolve,reject) => {
        that.$post('/user/checkCode',{
          code:that.code,
          codeType:code_type
        }).then(res=>{
          if (!res.code) {
            resolve(true)
          } else {
            reject(res.message)
            that.codeError = res.message;
          }
        })
      })
    },

现在我的需求是点击提交按钮的时候，去调用上面两个方法分别校验两个验证码是否正确，只有正确的情况下，才能去提交，于是我使用Promise.all() 去处理这两个函数，不知道这样写对不对，如果错了，应该怎么写才对

提交函数

confirm(){
      let that = this;
      Promise.all([this.verifyGA(12),this.checkCode(1)]).then(res=>{
        console.log(res);
        /* 正常处理提交流程 */
      }).catch(error=>{
        console.log(error);
        /* 抛出错误 */
      })
    }

然后我发现如果上面两个函数都请求失败的时候，promise.all().catch() 中抛出的error错误是第二个函数中的错误，而不是第一个函数的，这是为什么，如何才能抛出所有函数的错误呢？

Answer 1

error错误是第二个函数的错误应该是由于第二个函数的reject执行的更早。

const a = () => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      reject("a error");
    }, 300);
  });
}
const b = () => {
  return Promise.reject('b error')
}

Promise.all([a(), b()])
.then(data => {
  console.log(data);
})
.catch(err => {
  console.error(err);
});
// 输出
b error

Promise.all resolve的触发需要数组中所有的promise都resolve，而reject只需要其中任何一个promise reject就会触发。
如何捕获所有的错误呢？

const a = () => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      reject("a error");
    }, 300);
  });
}
const b = () => {
  return Promise.reject('b error')
}

Promise.all([a().catch(err => err), b().catch(err => err)])
.then(data => {
  console.log(data);
})
.catch(err => {
  console.error(err);
});
// 控制台输出
[ 'a error', 'b error' ]

需要注意的是这里输出其实是console.log(data)执行，而非console.error(err)执行

Answer 2

Promise.all(iterable) 方法返回一个 Promise 实例，此实例在 iterable 参数内所有的 promise 都“完成（resolved）”或参数中不包含 promise 时回调完成（resolve）；如果参数中 promise 有一个失败（rejected），此实例回调失败（reject），失败原因的是第一个失败 promise 的结果。
MDN

Promise.all只会返回第一个被rejected的结果。

Answer 3

换个思路就解决问题。。。

reject 的时候，调用 resolve({error:"error message"})

这样不论 失败还是成功，都是走 resolve，也就是2个都会 resolve
自行判断 promise.all 里的每个返回 是不是有 error key，然后搜集 error ，自己判断是否出错并报错