请教一个 Promise 的问题

[rodrick]

分别有下面两个写法，区别就是后者用的 .catch ，为啥同用调用后打印结果不一样呢，前者打印 1，后者打印 2

function myPromiseRace(arr) {
  return new Promise((resolve, reject) => {
    for (let item of arr) {
      item.then(
          res => { resolve(res) },
          err => { reject(err) }
        )
    }
  })
}

function myPromiseRace(arr) {
  return new Promise((resolve, reject) => {
    for (let item of arr) {
      item
        .then(
          res => { resolve(res) }
        )
        .catch(err => {
          reject(err)
        })
    }
  })
}

调用

let p1 = Promise.reject(1),
  p2 = Promise.resolve(2),
  p3 = Promise.resolve(3)

myPromiseRace([p1, p2, p3]).then(res => {
  console.log(res)
}).catch(err => {
  console.log(err);
})

[h503mc]

第二种写法需要 then 里的函数 reject 掉才会触发下一个的 catch

[genal]

第二个 mypromise 多了个 catch，相当于多套了一层，所以第一个 promise 更慢，由于 promise 只能 resolve，reject 一次，谁快先输出谁

[genal]

后面的 resolve,rejecrt 是什么不重要了，promise 只能 resolve，reject 一次

[faceRollingKB]

从 micro task 的角度看，promise 本体在 current task 中执行，then 里面的回调被添加到 micro task 队列中，而第二种写法里面的 catch 是在 then 所属的 micro task 被执行时才被添加到 micro task 队列的，所以：
第一种写法：三个 promise 依次被添加 then 里面定义的 micro task，得到队列 p1-then 、p2-then 、p3-then，p1-then 的 reject 回调会赢得 race ；
第二种写法：三个 promise 依次被添加 then 里面定义的 micro task，micro task 的执行结果会得到新的 promise，继而依次添加 catch 里面的 micro task，完全执行下去会有 6 个 micro task，依次是 p1-then 、p2-then 、p3-then 、p1-catch 、p2-catch 、p3-catch，p1 的 then 虽然排在第 1 位，但只是返回了一个新的 promise 并将 p1-catch 添加到 micro task 队列，并没有回调 then 的第一个参数，所以 p2-then 赢得 race 。

[rodrick]

@h503mc 是指 p1 还没 reject 的时候 p2 已经 resolve 了么
@genal 大概明白了

[rodrick]

@faceRollingKB 啊我明白了！确实是在微任务队列里是有先后执行顺序的，我给这茬忘了，非常感谢

[TommyDx]

第二种写法，在 p1 的 reject 还没被 catch 的时候，p2 的 resolve 已经被 new Promise 的 resolve 函数输出了

[cxe2v]

4 楼说的很详细了，我说下简化版本的

第一种写法，是同时将 resolve 和 reject 添加到了 微任务 队列
第二种写法，只是将 resolve 先添加到了微任务队列，然后再依次添加了 catch 到微任务

那么第二种写法在执行的时候，肯定是谁先 resolve 谁就赢了，因为 reject 的那个 catch 微任务是排在所有 resolve 的后面的

[Sparetire]

第一种写法一个 tick，第二种写法两个 tick