What is a promise?

The problem with JavaScript is that it often deals with asynchronous operations. These are steps that the code must complete which don't follow a linear flow in time. Normally, code runs line by line, one after the other, but what happens when we need to call an API that takes a random number of seconds to respond? We can't just stop our code and wait, and we will still have certain lines of code to execute once that call is complete, whenever that is.

The solution used to be callbacks. If we were using firebase.auth().signInWithEmailAndPassword in this manner, it would look like this:

firebase.auth().signInWithEmailAndPassword(email, password, function() {
  // Do something when the sign in is complete.
});

We would pass it a callback that is called when the operation is complete. This approach works fine, but can lead to some ugly code: specifically, something called the pyramid of doom, or callback hell, where nested callbacks lead to sloping code:

firebase.auth().signInWithEmailAndPassword(email, password, function() {
  onLoginComplete(email, password, function() { 
    onLoginCompleteComplete('contrived example', function() {
      anotherFunction('an argument', function () {
        console.log('Help I'm in callback hell!');
      });
    });
  });
});

To make working with asynchronous functions easier and cleaner, the people behind JavaScript implemented promises. Promises have a simple syntax: pass one function to a .then statement to be called when the operation is a success, and another to a .catch statement when the operation is a failure:

firebase.auth().signInWithEmailAndPassword(email, password)
  .then(() => { // Do something on success })
  .catch(err => { // Do something on failure. })

Now, our code is nice and readable, and we know exactly what code will be run when the operation is complete.