DEV Community

tonybui1812
tonybui1812

Posted on

Promises in JavaScript

Promises in JavaScript provide several methods for handling asynchronous operations. Promise.all and Promise.race are two of the most commonly used methods, but there are others as well. Here's an overview of these methods:

  1. Promise.all(iterable):

    • This method returns a single promise that resolves when all promises in the iterable (e.g., an array or iterable object) have resolved. If any of the promises in the iterable is rejected, the returned promise is rejected with the reason of the first rejected promise.
    • Use Case: You have multiple asynchronous operations that need to complete before performing another task that depends on the results of all the operations.
    • Example: Fetch data from multiple APIs concurrently and process the results once all the data has been retrieved.
     const promises = [promise1, promise2, promise3];
     Promise.all(promises)
       .then((results) => {
         // All promises resolved, results is an array of resolved values
       })
       .catch((error) => {
         // One of the promises was rejected, error contains the reason
       });
    
  2. Promise.race(iterable):

    • This method returns a promise that resolves or rejects as soon as one of the promises in the iterable resolves or rejects. It doesn't wait for all promises to settle; it takes the result of the first promise that settles (either resolves or rejects).
    • Use Case: You want to perform a task as soon as any of several asynchronous operations complete. It's often used for tasks that are time-sensitive.
    • Example: Implement a timeout mechanism for a network request, where you want to proceed with a default action if the request takes too long to complete
     const promises = [promise1, promise2, promise3];
     Promise.race(promises)
       .then((firstResult) => {
         // The first promise resolved, firstResult contains its value
       })
       .catch((firstError) => {
         // The first promise was rejected, firstError contains its reason
       });
    
  3. Promise.any(iterable):

    • Introduced in ES2021, this method returns a promise that resolves when at least one promise in the iterable resolves. If all promises are rejected, the returned promise is rejected with an AggregateError containing all the rejection reasons.
    • Use Case: You need to handle a scenario where at least one of several asynchronous operations must succeed, and you're interested in the first one that succeeds.
    • Example: In a real-time messaging application, you want to deliver a message as soon as any one of several recipients becomes available.
     const promises = [promise1, promise2, promise3];
     Promise.any(promises)
       .then((firstResult) => {
         // At least one promise resolved, firstResult contains its value
       })
       .catch((errors) => {
         // All promises were rejected, errors is an AggregateError
       });
    
  4. Promise.allSettled(iterable):

    • This method returns a promise that settles (either resolves or rejects) when all promises in the iterable have settled. The returned promise always resolves with an array of objects representing the settled status and value/reason of each promise.
    • Use Case: You want to ensure that you collect the results of multiple asynchronous operations, regardless of whether they succeeded or failed, and you need to handle each result individually.
    • Example: When submitting a batch of forms in a multi-step process, you want to report to the user which forms had validation errors and which ones were successfully submitted.
     const promises = [promise1, promise2, promise3];
     Promise.allSettled(promises)
       .then((results) => {
         // All promises have settled, results is an array of objects
         // Example result: { status: 'fulfilled', value: 'resolvedValue' }
       });
    
  5. Promise.resolve(value):

    • This method returns a resolved promise with the specified value. It's often used to create a promise that resolves immediately.
    • Use Case: You want to create a promise that immediately resolves with a specific value. This is useful when you want to wrap a synchronous operation in a promise.
    • Example: Wrapping a function that reads a local file into a promise so that it can be used in an asynchronous context.
     const resolvedPromise = Promise.resolve('Resolved Value');
    
  6. Promise.reject(reason):

    • This method returns a rejected promise with the specified reason. It's used to create a promise that is immediately rejected.
    • Use Case: You want to create a promise that immediately rejects with a specific reason. It's useful for creating an immediately failed promise.
    • Example: Simulating a failed network request in a testing environment.
     const rejectedPromise = Promise.reject('Reason for Rejection');
    

These Promise methods provide powerful tools for managing asynchronous operations in JavaScript, and they can be used in a variety of scenarios to handle multiple promises, timeouts, and more.

Top comments (0)