Promise.then(a, b) 和 Promise.then(a).catch(b) 一样吗？ [复制]

Question

两者有什么区别

• myPromise.then(a, b)

• myPromise.then(a).catch(b)

?

无论myPromise 的内容和状态以及a 和b 的函数实现如何，这两个JavaScript 表达式是否总是产生相同的结果？

除了代码可读性之外，我是否更喜欢使用其中一种？

Answer 1

它们在处理 then() 回调中的错误的方式上有所不同，在某些情况下，这可能是一个足够大的差异，大多数人建议仅使用 catch()。

例如使用catch()，您可以捕获此错误：

Promise.resolve('test')
.then(r => {
  throw("whoops")
})
.catch(e => console.log("caught error:", e))

不能使用then(a,b) 样式：

Promise.resolve('test')
.then(r => { throw("whoops")},
      e => console.log("caught error?", e))
// unhandled rejection (you'll need to look in the console)

除了一些测试场景之外，很难想到会首选这种行为的用例。

您可以同时使用这两种方法，这将在then() 回调中捕获拒绝和错误，但这会使事情变得比您可能需要的更加混乱，除非您有一个特殊的用例来区分这两种错误。例如哪个处理程序处理哪些错误：

Promise.reject("rejected")
.then(r => {throw("whoops")}, 
     e => console.log("Promise 1: caught error in second function:", e))
.catch(e=> console.log("Promise 1: caught error in catch", e))

Promise.resolve("rejected")
.then(r => {throw("whoops")}, 
     e => console.log("Promise 2: caught error in second function:", e))
.catch(e=> console.log("Promise 2: caught error in catch", e))

Answer 2

推荐使用catch()，因为当我们在一个promise链中使用myPromise.then(a, b)时，即使promise被拒绝，next then block也会一直执行。这是因为承诺链认为我们已经清除了错误处理程序中的错误。 看下面的例子： 即使我们reject() 下一个 then 块也会执行。

function asyncFun(a,b){
  return new Promise((resolve, reject)=>{
      if(typeof a ==="number" && typeof b === "number")
        resolve(a + b);
      else
        reject("invalid data!!");
  });
}
asyncFun(2,'4').then((response)=>{
  console.log(response);
  return response;
}, (error)=>{
  console.log(error);
}).then((response)=>{
  console.log("console 2",response)
}, (error)=>{
  console.log(error);
});

虽然如果我们在 Promise 链的末尾仅使用单个错误处理程序 catch()，则不会发生这种情况：请注意正如 Bergi 指出的那样，即使在多个 catch() 的情况下也会重现上述场景。

function asyncFun(a,b){
  return new Promise((resolve, reject)=>{
      if(typeof a ==="number" && typeof b === "number")
        resolve(a + b);
      else
        reject("invalid data!!");
  });
}
asyncFun(2,'4').then((response)=>{
  console.log(response);
  return response;
}).then((response)=>{
  console.log("console 2",response)
}).catch((err)=> console.log(err));

Answer 3

我认为这两种方式是相同的。但是，我更喜欢使用async().then().catch()，因为它更容易阅读。

此外，如果您想一一调用一些异步函数，但如果抛出一些错误需要立即中断（不希望以下函数继续运行）。您只需要在决赛中放 1 个接球即可。在这种情况下，我们不能使用第一种样式。

asyncA()
    .then((val) => asyncB(val))
    .then((val) => asyncC(val))
    .then((val) => asyncD(val))
    .catch(() => { /* any of asyncA, asyncB, asyncC, asyncD will goes directly here if throwing error })

在上面的例子中。可以看到，任何一个函数async失败，程序都会跳过后面的函数直接catch。