snippetjavascriptTip
The order of then and catch matters
Viewed 0 times
mattersjavascriptandcatchorderthenthe
Problem
Many if not most promise-related headaches come from incorrectly ordered
As you can see from this example, swapping the
So, next time you are working with promises, try to think of
Promise.prototype.then() and Promise.prototype.catch() methods. The order in which these methods are chained to a promise can lead to very different behaviors. Let's take a look at a very simple example:As you can see from this example, swapping the
catch() and then() methods results in entirely different behavior, even though the promise has the same result. This is due to the fact that each chained method will result itself in a promise. This means that the first one will pass its result to the second, the second to the third and so on and so forth. While this might seem obvious when looking at an example like this one, many times it's overlooked and can result in hard to debug issues. This is especially true when the promise chain is long and complicated.So, next time you are working with promises, try to think of
then() and catch() methods in terms of promise chaining and remember that order matters!Solution
const myPromise = () => Promise.reject('Oops!');
const logger = data => console.log(data);
const identity = data => data;
myPromise().catch(identity).then(logger); // LOGS: Oops!
myPromise().then(logger).catch(identity); // Nothing is loggedSo, next time you are working with promises, try to think of
then() and catch() methods in terms of promise chaining and remember that order matters!Code Snippets
const myPromise = () => Promise.reject('Oops!');
const logger = data => console.log(data);
const identity = data => data;
myPromise().catch(identity).then(logger); // LOGS: Oops!
myPromise().then(logger).catch(identity); // Nothing is loggedContext
From 30-seconds-of-code: promise-then-catch
Revisions (0)
No revisions yet.