Mastering Asynchronous Operations with JavaScript Promise.all()

Promise.all is a powerful feature in JavaScript that allows you to deal with multiple asynchronous operations concurrently and handle them collectively. It takes an array of promises and returns a new promise that resolves when all the input promises have resolved or rejects as soon as one of the promises in the array rejects.

Here’s a breakdown of how Promise.all works:

Syntax:

Promise.all(iterable);

Parameters:

• iterable: An iterable (e.g., an array) containing promises.

Return Value:

• A single promise that fulfills with an array of the fulfilled values when all the promises in the iterable argument have been fulfilled. If any of the promises reject, the returned promise is rejected with the reason of the first promise that was rejected.

Example:

Let’s say you have several asynchronous tasks represented by promises, and you want to perform some action only when all of them are completed. Here’s an example using Promise.all:

const promise1 = new Promise((resolve) => setTimeout(() => resolve('One'), 1000));
const promise2 = new Promise((resolve) => setTimeout(() => resolve('Two'), 2000));
const promise3 = new Promise((resolve) => setTimeout(() => resolve('Three'), 1500));

const promisesArray = [promise1, promise2, promise3];
Promise.all(promisesArray)
  .then((results) => {
    console.log('All promises resolved:', results);
    // Do something with the resolved values
  })
  .catch((error) => {
    console.error('One of the promises rejected:', error);
    // Handle the first rejection
  });

In this example, the Promise.all function is used to wait for all promises in the promisesArray to resolve. The then block executes when all promises are resolved, providing an array of resolved values. If any of the promises reject, the catch block is triggered, handling the rejection.

Key Points:

1. Concurrent Execution:

• Promise.all allows asynchronous operations to run concurrently, improving performance by executing tasks simultaneously.

1. Collective Handling:

• It provides a way to collectively handle the results of multiple promises, making it useful for scenarios where you need to wait for several asynchronous tasks to complete before proceeding.

1. Early Rejection:

• If any promise in the array rejects, the entire Promise.all is rejected, and the rejection reason is the reason of the first promise that rejects.

1. Order Preservation:

• The order of results in the resolved array matches the order of promises in the input array, regardless of the order in which the promises are resolved.

1. Parallelism:

• The promises in the array are initiated in parallel, but the order of their resolution may differ based on their execution time.

Use Cases:

1. API Requests:

• When making multiple API requests concurrently and needing to wait for all responses.

1. File Uploads:

• Uploading multiple files and waiting for all uploads to complete before further processing.

1. Database Queries:

• Performing several database queries and waiting for all queries to finish before proceeding.

1. Parallel Initialization:

• Initializing multiple resources or services in parallel.

Promise.all is a powerful tool for handling multiple asynchronous operations, making your code more efficient and concise when dealing with complex scenarios involving concurrency.

Read other Articles in AKCoding.com

AK Coding - Empowering developers with programming concepts