深刻理解Promise系列(四):catch

语法糖

catch 其实是 then(undefined, () => {}) 的语法糖，如下：

let p = Promise.reject("error");

// catch
p.catch(err => {
  console.log("catch " + err); // catch error
});

// then
p.then(undefined, err => {
  console.log("catch " + err); // catch error
});

捕获错误

Promise对象内部其实自带了try catch，当同步代码发生运行时错误时，会自动将错误对象作为值reject，这样就会触发catch注册的回调，如下：

let p = new Promise((resolve, reject) => {
  throw "error";
});

p.catch(err => {
  console.log("catch " + err); // catch error
});

但需要注意的是：

1. 异步代码的运行时错误无法被自动 reject 进而被 catch 捕获，而是直接报错：

let p = new Promise((resolve, reject) => {
  setTimeout(() => {
    throw "error";
  }, 0);
});

p.catch(err => {
  console.log("catch " + err); // 不会被执行
});

关于异步错误是否会被 catch 捕获其实还有点坑，事实证明之所以 setTimeout 中产生的错误不会被 catch 捕获到，原因是 js 的事件队列中，Promise 的 catch 会在 setTimeout 回调之前执行；但是若异步操作抛出错误的回调是在 Promise 的 catch 之前执行的，其实还是可以被 catch 所捕获到的，比如 Promise 的 then 方法所抛出的错误：

let p = Promise.resolve();

let p1 = new Promise(function (resolve, reject) {
  p.then(()=>{
    throw 123;
  }).catch(e => {
    reject(e);
  });
});

p1.catch(err => {
  console.log(err); // 123，错误成功被捕获
});

2. 一旦 Promise 对象已经 resolve，其后的运行时错误将被忽略：

let p = new Promise((resolve, reject) => {
  resolve();
  throw "error";
});

p.catch(err => {
  console.log("catch " + err); // 不会被执行
});

return的值

与 then 方法相同，执行后会 return 一个新的 Promise 对象，以实现链式调用，你可以显式的 return 一个 Promise 对象，若不显式的 return 则会 return 一个以 undefined 值 resolve 的 Promise 对象；

let p = Promise.reject("error");

// catch
p.catch(err => {
  console.log("catch " + err); // catch error
  // 这里会默认return Promise.resolve(undefined);
}).then(res => {
  console.log(res); // undefined
});

let p2 = Promise.resolve("success");

// then
p2.catch(err => { // 由于p2正常resolve，所以此处不会执行
  console.log("catch " + err);
}).then(res => { // 由于前一个catch未执行，所以此处调用then的还是p2
  console.log(res); // success
  // 这里会默认return Promise.resolve(undefined);
}).then(res => {
  console.log(res); // undefined
});