Promise.all() vs. Promise.allSettled(): Understanding the differences

Also available on my blog

Introduction

In modern JavaScript development, understanding and effectively using Promises is crucial for managing asynchronous operations. Two important methods for handling multiple promises are Promise.all() and Promise.allSettled(). Knowing when and how to use these methods can significantly improve your code's readability and efficiency.

In this article, we will explore the differences between Promise.all() and Promise.allSettled(), providing examples and discussing the most appropriate use cases for each method. By the end of this article, you'll have a clear understanding of which method to choose based on your specific requirements.

Promise.all()

Promise.all() is a method that takes an array or iterable of promises as input and returns a single promise that resolves when all the input promises are fulfilled. The resulting promise resolves with an array of the fulfilled values in the same order as the input promises.

const promise1 = Promise.resolve(1);
const promise2 = Promise.resolve(2);
const promise3 = Promise.resolve(3);

Promise.all([promise1, promise2, promise3]).then(values => {
  console.log(values); // Output: [1, 2, 3]
});

If one of the input promises rejects, Promise.all() immediately rejects with the reason of the first rejected promise, discarding the results of any other promises.

const promise1 = Promise.resolve(1);
const promise2 = Promise.reject('Error');
const promise3 = Promise.resolve(3);

Promise.all([promise1, promise2, promise3]).catch(reason => {
  console.log(reason); // Output: 'Error'
});

Benefits of using Promise.all() include the ability to manage multiple promises concurrently and simplifying the code when all input promises must succeed to perform a subsequent action.

Promise.allSettled()

Promise.allSettled() is a method that takes an array or iterable of promises and returns a single promise that resolves when all input promises are settled, meaning they have either been fulfilled or rejected. The resulting promise resolves with an array of objects describing the outcomes of each input promise in the same order.

const promise1 = Promise.resolve(1);
const promise2 = Promise.reject('Error');
const promise3 = Promise.resolve(3);

Promise.allSettled([promise1, promise2, promise3]).then(results => {
  console.log(results);
  // Output: [
  //   { status: 'fulfilled', value: 1 },
  //   { status: 'rejected', reason: 'Error' },
  //   { status: 'fulfilled', value: 3 }
  // ]
});

Unlike Promise.all(), Promise.allSettled() does not reject when one or more input promises reject. Instead, it captures both fulfilled and rejected promises, providing a comprehensive overview of the results.

Benefits of using Promise.allSettled() include the ability to continue processing results even if some input promises fail, allowing for greater fault tolerance and flexibility in handling asynchronous operations.

Comparison of Promise.all() and Promise.allSettled()

The main differences between Promise.all() and Promise.allSettled() lie in their behavior when handling rejected promises. Promise.all() rejects as soon as one input promise rejects, whereas Promise.allSettled() waits for all input promises to settle, regardless of their outcomes.
Use Promise.all() when all input promises must succeed to perform a subsequent action or when you need to fail fast in case of any rejected promise.
Use Promise.allSettled() when you want to proceed with processing results even if some input promises fail, or when you need to gather information about the outcomes of all input promises.

Examples:

• Promise.all(): Fetching multiple resources that must all be available to render a web page.
• Promise.allSettled(): Running multiple analytics queries where partial results are still valuable, even if some queries fail.

Conclusion

In this article, we have explored the differences between Promise.all() and Promise.allSettled(), providing examples and discussing the most appropriate use cases for each method.

In summary, use Promise.all() when all input promises must succeed, and use Promise.allSettled() when you need to handle the results of multiple promises, regardless of their outcomes.
By understanding and applying these methods effectively, you can greatly improve the readability and efficiency of your JavaScript code when dealing with asynchronous operations.