[陈同学i前端]Promise中的then第二个参数和链式调用catch的区别

用过Promise的同学都知道，reject是在Promise回调方法执行过程中用来抛出异常的方法，而catch是用来处理异常的

reject是Promise回调函数的方法，而then和catch是Promise原型上的方法

区别

若then的第一个函数里抛出了异常，后面的catch能捕获到，而then的第二个函数捕获不到。

catch为调用实际为语法糖最后通过then处理异常

Promise.prototype.catch = function(fn){
    return this.then(null,fn);
}

• 若promise内部报错，reject抛出错误后，then的第二个参数和catch方法都存在的情况下，只有then的第二个参数能捕获到

• 若then第二个参数不存在，则catch方法会捕获到

const promise = new Promise((resolve, rejected) => {
    throw new Error('error');
});

/**
 * Promise回调函数抛异常
 * 只有then的第二个参数可以捕获到错误信息
 */
promise.then(res => {
    /**
     * do sth
     */
}, (err) => {
    console.log(err);
}).catch((err) => {
    console.log(err);
});


/**
 * Promise回调函数抛异常
 * 无then的第二参数，catch方法可以捕获到错误信息
 */
promise.then((res) => {
    /**
     * do sth
     */
}).catch((err) => {
    console.log(err);
});


/**
 * then回调抛出错误
 * 只有then的第二个参数可以捕获到Promise内部抛出的错误信息
 */
promise.then((res) => {
    throw new Error('error');
}, (err) => {
    console.log(err);
}).catch((err) => {
    console.log(err);
});

/**
 * then回调抛出错误
 * 只有then的第二个参数可以捕获到Promise内部抛出的错误信息
 */
promise.then((res) => {
    throw new Error('error');
}, (err) => {
    console.log(err);
});

/**
 * then回调抛出错误
 * catch可以捕获到Promise内部抛出的错误信息
 */
promise.then((res) => {
    throw new Error('error');
}).catch((err) => {
    console.log(err);
});

实例补充

new Promise((resolve, rejected) => {
    rejected('rejected error');
    // throw new Error('throw error');
}).then((resp) => {
    console.log('then', resp);
}, (error) => {
    console.log('err', error); // 无论是rejected()还是throw，均为then第二参数回调执行;
}).catch((error) => {
    console.log('catch', error);
})

两个捕获方法的比较

/**
 * good
 */
promise
  .then((resp) => {
    /**
     * success
     */ 
  }, (err) => {
    /**
     * error
     */
  });

/**
 * better
 */
promise
  .then((resp) => {
    /**
     * success
     */ 
  })
  .catch((err) => {
    /**
     * error
     */
  });

上面代码中，第二种写法要好于第一种写法，理由:

1. 第二种写法可以捕获前面then方法执行中的错误
2. 类似同步处理异常的写法

Promise作为日常工作当中最重要的组成部分之一，还是需要了解Promise的运行原理，扒一扒Promise源码（虽然多但是不难），后面可能还会出一期关于Promise源码的深度思考文章，有兴趣的小伙伴可以关注一下~ 你的支持是我做内容产出的最大动力！