SoFunction
Updated on 2025-04-10

ES6   Basic usage of Promise (resolve, reject, then, catch, all)

In JavaScript, Promise is an object used to handle asynchronous operations. It allows developers to handle asynchronous operations in a clearer and more controllable way, avoiding the problem of callback hell. The Promise object has the following states:

Pending: Initial state, indicating that the asynchronous operation is in progress.
Fulfilled: Indicates that the asynchronous operation has been successfully completed.
Rejected: Indicates that the asynchronous operation failed.
The Promise object provides two methods to change its state: resolve and reject. The then and catch methods are used to handle the success and failure states of the Promise. The all method is used to wait for a set of Promise instances to complete.

The following is a detailed explanation of the basic usage of Promise:

Create a Promise: Use new Promise() to create a new Promise object and pass in a function as a parameter. This function is called an executor, which takes two parameters: resolve and reject. The resolve function is used to set the state of the Promise to fulfilled, and the reject function is used to set the state of the Promise to rejected.

const promise = new Promise((resolve, reject) => {
  // Asynchronous operation  if (/* Asynchronous operation succeeds */) {
    resolve(/* Successful results */);
  } else {
    reject(/* Reason for failure */);
  }
});

Use the then method: the then method is used to handle the fulfilled state of the Promise. It accepts two parameters: one function is used to handle successful results and the other function is used to handle failed results (optional).

((result) => {
  // Successful callback function  (result);
}, (error) => {
  // Failed callback function (optional)  (error);
});

Use the catch method: The catch method is used to handle the rejected state of the Promise. It is equivalent to passing only the then method of the failed callback function.

((error) => {
  // Failed callback function  (error);
});

Use the all method: The all method is used to wait for a set of Promise instances to complete. It returns a new Promise object, and the new Promise object will succeed when all Promise instances succeed; if any Promise instance fails, the new Promise object will also fail.

const promises = [promise1, promise2, promise3];
(promises).then((results) => {
  // Callback function when all Promise instances are successful  (results);
}).catch((error) => {
  // Callback function when any Promise instance fails  (error);
});

Use the race method: The race method is used to wait for any of a set of Promise instances to complete. It returns a new Promise object that will complete when the first Promise instance completes, whether it is successful or failed.

const promises = [promise1, promise2, promise3];
(promises).then((result) => {
  // Callback function when the first Promise instance is completed  (result);
}).catch((error) => {
  // Callback function when the first Promise instance fails  (error);
});

This is the article about the basic usage of ES6 Promise (resolve, reject, then, catch, all). For more information about ES6 Promise usage, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!