CODEWITHSUNDEEP
javascriptpromisees6-promise
Héctor
Héctor

Reputation: 419

promise catch: how to know if the error comes from promise rejection or from the then statement

Imagine a function that returns a promise (for example fetch from fetch API):

fetch(...)
.then((response) => {...})
.catch((error) => {...});

How can I know if the error inside the catch statement has been originated due to a promise rejection instead from the code inside the then statement?

Something like the following will work:

let success = false;
fetch(...)
.then((response) => {success = true; ...})
.catch((error) => {if(success) ...});

But I want to know if there is a better or more native way to do it. I have also tried to do something like:

fetch(...)
.catch((promiseError) => {...});
.then((response) => {...})
.catch((thenError) => {...});

But I think it doesn't work because response isn't forwarded to the thenstatement (or at least that's what TS says).

Which would be the better way?

Upvotes: 2

Views: 2155

Answers (2)

T.J. Crowder
T.J. Crowder

Reputation: 1075289

then accepts two parameters¹: A function to call on fulfillment, and another to call on rejection. So you can handle the initial rejection earlier:

fetch(/*...*/)
.then(
    // Fulfillment handler
    (response) => {
        /*...*/
    },
    // Rejection handler for `fetch` promise
    (error) => {
        /*...*/
    }
)
.catch((error) => {
    // This rejection handler only sees errors not handled above
});

The first rejection handler (in the then call) is only called for rejections of the promise from fetch, not rejections caused by errors in the fulfillment handler.

The second rejection handler (in the catch call) is called for rejections caused by errors (or rejected promises) from the handlers that come before it (either fulfillment or rejection); it doesn't get called if the original promise is rejected (but it may well get called if the first rejection handler throws an error or returns a promise that is/will be rejected).

So in those cases where you care, you can handle it closer to the source.

Note that all rejection handlers that don't either throw an error or return a promise that is/will be rejected convert rejection (of the original promise) into fulfillment (of the one from then/catch). That can matter for downstream then handlers.

A key thing to understanding this is to remember that then (and its wrappers catch and finally) return a new promise. That's why:

aPromise.then(onFulfilled).catch(onRejected);

is different from

aPromise.then(onFulfilled, onRejected);

The first one hooks up a fulfillment handler to aPromise, and then hooks up a rejection handler to the promise then returns (which means the rejection handler will be called if aPromise rejects or if the fulfillment handler throws an error or returns a promise that rejects). In contrast, the second one only hooks up handlers on aPromise, so errors/rejections from the fulfillment handler do not trigger the rejection handler.

¹ In fact, .catch(fn) is just a wrapper for .then(undefined, fn). :-) spec link

Upvotes: 6

0nepeop1e
0nepeop1e

Reputation: 137

if the function pass to then returns a promise,

promise
    .then(
        (async (response)=>{
            ...
        }).catch((errorFromThen) => {})
    ).catch((errorFromPromise) => {})

or just simply

promise
    .then(
        (response)=>{
            try {
                ...
            } catch (errorFromThen) {
                ...
            }
        }
    ).catch((errorFromPromise) => {})

Upvotes: -2

Related Questions