What is a Promise?
There's no better place to start than at the beginning, right? So what exactly is a promise?
Per the Mozilla Develoepr Network:
A Promise represents a value which may be available now, or in the future, or never.
When a promise is resolved, the resolved value is made available via the promise. So, if we had a long running HTTP request to retrieve a user, once that request completes, we would resolve the promise with the user, which would make the user available to anyone that was waiting for the promise to be resolved.
A promise can also be rejected, indicating that there was a problem, and that the promise will never be resolved. We can optionally hand back a value as part of rejecting the promise, too, and anyone that is watching will receive that value.
Before we talk about how to create and use our own promises, let's talk about how to be good consumers of promises.
Let's pretend some function hands us back a promise:
const myPromise = someAsyncLongRunningOperation();
We want to capture the result once it's available. To do that, we use our promise's
then function to register a callback function. That callback function will receive the result of the promise, once it's available:
myPromise.then(result => console.log('We got the result: ', result));
What if something goes wrong though, and our promise is rejected? There are actually a couple of ways we could be notified about that. One is to pass a second callback to the then function:
myPromise.then(result => console.log('We got the result: ', result), error => console.log('Bad news, Jim: ', error));
We could also make use of the promise's catch function:
myPromise.catch(error => console.log('Bad news, Jim: ', error));
It's important to understand that these two approaches are not equivalent. There are subtle, important differences in the behavior you'll see. I tend to use
catch instead of
then(function,function), for reasons I'll explain in a future post
I think that's a good starting point. Up next, let's look at creating our own promises!