es6 promise的catch 和 then 的区别认识

Posted 2023-05-08

参考技术A

catch 返回实值：Promise <resolved>: 1
catch 抛出错误：Promise <rejected>: "err"
catch 无返回： Promise <resolved>: undefined

then 返回实值：Promise <resolved>: 1
then 抛出错误：Promise <rejected>: "err"
then 无返回： Promise <resolved>: undefined

resolved状态下：then执行，catch不执行
rejected状态下: then不执行，catch执行

关键在于undefined下，其实也属于resolved状态，

所以会有这个特点
我们经常使用时并不会在then和catch中去返回特定的值，
于是我们假定callA和callB中返回的都是undefined:
我们的想要的结果是：resolve时只执行callA,reject时只执行callB

P_resolve.then(callA).catch(callB) callA执行后，callB不执行 符合
P_reject.then(callA).catch(callB) callA不执行后，callB执行 符合
而如果这样使用
P_reject.catch(callB).then(callA) 当callB执行时，callA也会被执行 不符合
P_resolve.catch(callB).then(callA) 当callB不执行，callA会被执行 符合

因此如果在复杂的链式调用中出现catch后会接上then的情况，catch中一定需要写上返回reject态的Promise，当你不需要执行后续的then时。

但同时也会导致，在后续没有另外一个catch的话，该catch抛出的错误被抛到应用顶层，最终系统报错。

基本也就能认为， 如果要安全地使用Promise，保证系统不报错的前提下，catch必须被最后调用并返回resolve状态。

重读es6， 正确了解promise中catch的用法

前言

在最近的项目中，用到了es6的promise语法，发现promise.prototype.catch 并不只是单单reject抛出的回调函数，所以今天做一些笔录，防止以后在项目中又碰到这样的问题。

先介绍一下promise.prototype.catch

Promise.prototype.catch 方法是 .then(null, rejection) 或是 .then(undefined, rejection)的别名，用于指定发生错误时的回调函数。

如果Promise 对象状态变为resolved，则会调用then方法指定的回调函数；如果异步操作抛出错误，状态就会变为rejected，就会调用catch方法指定的回调函数，处理这个错误。另外，then方法指定的回调函数，如果运行中抛出错误，也会被catch方法捕获。

下面是摘抄阮一峰的es6入门的

p.then((val) => console.log(‘fulfilled:‘, val))
  .catch((err) => console.log(‘rejected‘, err));

// 等同于
p.then((val) => console.log(‘fulfilled:‘, val))
  .then(null, (err) => console.log("rejected:", err));

下面是我自己写的例子

const testPromise = new Promise(function (resolve, reject) 
    let a = 5
    if (a === 5) 
      resolve(‘success‘)
     else 
      reject(‘catch error‘)
    
  )
  testPromise.then(res => 
    throw new Error(‘then error‘)
  ).catch(err => 
    console.log(‘catch error‘)
    console.log(err)
  )

这个例子最终会先输出catch error，然后再抛出错误信息。

总结

then中抛出错误，就会调用promise.prototype.catch的回调函数。