Promises

A JavaScript Promise is an object that represents the eventual completion (or failure) of an asynchronous operation and its resulting value. Promises provide a cleaner, more flexible way to handle asynchronous operations compared to traditional callback-based approaches.

What is a Promise?

In JavaScript, a Promise is an object that represents a value that may be available now, or in the future, or never. It allows you to associate handlers with an asynchronous action's eventual success value or failure reason.

Why Use Promises?

Promises are useful for a variety of purposes, including:

Improved readability: Promises help avoid "callback hell" by allowing you to chain asynchronous operations.
Error handling: Promises provide a consistent way to handle errors in asynchronous code.
Composability: Promises can be combined and chained, making it easier to manage complex asynchronous workflows.

Creating a Promise

There are several ways to create a promise in JavaScript:

Using the `Promise` Constructor

This is the most common method of creating a promise.

const myPromise = new Promise((resolve, reject) => {
  // Asynchronous operation
  setTimeout(() => {
    const success = true;
    if (success) {
      resolve('Operation was successful');
    } else {
      reject('Operation failed');
    }
  }, 1000);
});

Using `Promise.resolve` and `Promise.reject`

These methods create a promise that is already resolved or rejected.

const resolvedPromise = Promise.resolve('Already resolved');
const rejectedPromise = Promise.reject('Already rejected');

Handling Promises

There are several methods that can be used to handle promises, including then, catch, and finally.

Using `then`

The then method is used to handle the resolved value of a promise.

myPromise.then((value) => {
  console.log(value); // "Operation was successful"
});

Using `catch`

The catch method is used to handle the rejected value of a promise.

myPromise.catch((error) => {
  console.error(error); // "Operation failed"
});

Using `finally`

The finally method is used to execute code regardless of whether the promise was resolved or rejected.

myPromise.finally(() => {
  console.log('Promise has been settled');
});

Example Use Case

Here's an example of how you might use promises to handle an asynchronous operation, such as fetching data from an API:

function fetchData(url) {
  return new Promise((resolve, reject) => {
    fetch(url)
      .then(response => {
        if (!response.ok) {
          throw new Error('Network response was not ok');
        }
        return response.json();
      })
      .then(data => resolve(data))
      .catch(error => reject(error));
  });
}

fetchData('https://api.example.com/data')
  .then(data => {
    console.log('Data fetched successfully:', data);
  })
  .catch(error => {
    console.error('Error fetching data:', error);
  });

In this example, the fetchData function returns a promise that resolves with the fetched data or rejects with an error. The then and catch methods are used to handle the resolved and rejected values, respectively.

Last modified: 20 November 2024

Promises

What is a Promise?

Why Use Promises?

Creating a Promise

Using the Promise Constructor

Using Promise.resolve and Promise.reject