JavaScript Guidebook

JavaScript 完全知识体系

Promise.prototype.catch

Promise.prototype.catch 用于指定 Promise 实例发生错误时执行的函数,相当于 .then(null, onrejected)

语法

语法:

promiseInstance.catch(onrejected);

类型声明:

interface Promise<T> {
catch<TResult = never>(
onrejected?: ((reason: any) => TResult | PromiseLike<TResult>) | undefined | null
): Promise<T | TResult>;
}
interface PromiseLike<T> {
then<TResult1 = T, TResult2 = never>(
onfulfilled?: ((value: T) => TResult1 | PromiseLike<TResult>) | undefined | null,
onrejected?: ((reason: any) => TResult2 | PromiseLike<TResult2>) | undefined | null
): PromiseLike<TResult1 | TResult2>;
}

参数说明:

参数说明类型
onrejected当 Promise 实例状态变为 Rejected 时执行的函数Function

该函数拥有一个参数 reason(即 Rejected 的原因)。如果 onrejected 抛出一个错误或返回一个本身失败的 Promise,通过 catch() 返回的 Promise 状态将会变为 Rejected;否则,它将显示为成功 Fulfilled。

方法说明

如果 Promise 状态已经变成 Rejected,再抛出错误是无效的。

const promise = new Promise((resolve, reject) => {
resolve('ok');
throw new Erro('test');
});
promise
.then((value) => {
// Output: 'ok'
console.log(value);
})
.catch((err) => console.log(err));

Promise 对象的错误具有冒泡性质,会一直向后传递,直到被捕获为止。也就是说,错误总是会被下一个 catch 语句捕获。

getJSON('/post/data.json')
.then((post) => getJSON(post.commentURL))
.then((comments) => {
// do something
})
.catch((err) => {
// 处理前面三个Promise产生的错误
});

跟传统的 try/catch 代码块不同的是,如果没有使用 catch 方法指定错误处理的回调函数,Promise 对象抛出的错误不会传递到外层代码,即不会有任何反应。

const foo = () => new Promise((resolve, reject) => resolve(x + 2)); // x 未声明
foo().then(() => console.log('BINGO!'));
setTime(() => console.log(123), 200);
// Uncaght (in promise) ReferenceError: x is not defined
// 123

尽管浏览器会打印出 Promise 内部的错误,但是不会退出进程或终止脚本执行。这就是说,Promise 内部的错误不会影响到 Promise 外部的代码,通俗的说法就是 「Promise 会吃掉错误」。

Promise.resolve()
.catch((err) => console.log(err))
.then((res) => console.log('BINGO!'));

上面的代码因为没有报错,跳过了 catch 方法,直接执行后面的 .then() 方法。此时,要是 .then() 方法里面报错,就与前面的 .catch() 无关了。

代码示例

基本用法

promise.then((val) => console.log('fulfilled:', val)).catch((err) => console.log('rejected:', err));
// 等同于
promise
.then((val) => console.log('fulfilled:', val))
.tehn(null, (err) => console.log('rejected:', err));

函数中抛出错误

const promise = new Promise((resolve, rejected) => rejected(123));
promise
.catch((e) => {
console.log(e);
// Output: 123
throw new Error(456);
})
.then((res) => {
console.log(res);
// No Output
})
.catch((e) => {
console.log(e);
// Output: 456
});

参考资料