Key Concepts

Review core concepts you need to learn to master this subject

JavaScript Promise Object

States of a JavaScript Promise

Creating a Javascript Promise object

Executor function of JavaScript Promise object

setTimeout()

.then() method of a JavaScript Promise object

Chaining multiple .then() methods

The .catch() method for handling rejection

See more

JavaScript Promise Object

A JavaScript Promise is an object that can be used to get the outcome of an asynchronous operation when that result is not instantly available.

Since JavaScript code runs in a non-blocking manner, promises become essential when we have to wait for some asynchronous operation without holding back the execution of the rest of the code.

JavaScript Promises
Lesson 1 of 2
  1. 1
    Introduction
    In web development, asynchronous programming is notorious for being a challenging topic. An asynchronous operation is one that allows the computer to “move on” to other tasks while waiting for …
    Start
  2. 2
    What is a Promise?
    Promises are objects that represent the eventual outcome of an asynchronous operation. A Promise object can be in one of three states: * Pending: The initial state— the operation has not …
    Start
  3. 3
    Constructing a Promise Object
    Let’s construct a promise! To create a new Promise object, we use the new keyword and the Promise constructor method: const executorFunction = (resolve, reject) => { }; const myFirstPromise = new P…
    Start
  4. 4
    The Node setTimeout() Function
    Knowing how to construct a promise is useful, but most of the time, knowing how to consume, or use, promises will be key. Rather than constructing promises, you’ll be handling Promise objects ret…
    Start
  5. 5
    Consuming Promises
    The initial state of an asynchronous promise is pending, but we have a guarantee that it will settle. How do we tell the computer what should happen then? Promise objects come with an aptly named ….
    Start
  6. 6
    Success and Failure Callback Functions
    To handle a “successful” promise, or a promise that resolved, we invoke .then() on the promise, passing in a success handler callback function: const prom = new Promise((resolve, reject) => { re…
    Start
  7. 7
    Using catch() with Promises
    One way to write cleaner code is to follow a principle called separation of concerns. Separation of concerns means organizing code into distinct sections each handling a specific task. It enables…
    Start
  8. 8
    Chaining Multiple Promises
    One common pattern we’ll see with asynchronous programming is multiple operations which depend on each other to execute or that must be executed in a certain order. We might make one request to a d…
    Start
  9. 9
    Avoiding Common Mistakes
    Promise composition allows for much more readable code than the nested callback syntax that preceded it. However, it can still be easy to make mistakes. In this exercise, we’ll go over two common m…
    Start
  10. 10
    Using Promise.all()
    When done correctly, promise composition is a great way to handle situations where asynchronous operations depend on each other or execution order matters. What if we’re dealing with multiple promi…
    Start
  11. 11
    Review
    Awesome job! Promises are a difficult concept even for experienced developers, so pat yourself on the back. You’ve learned a ton about asynchronous JavaScript and promises. Let’s review: + Promises…
    Start

How you'll master it

Stress-test your knowledge with quizzes that help commit syntax to memory

Pro Logo