0
0
JavascriptHow-ToBeginner · 3 min read

How to Use Promise.all in JavaScript: Simple Guide

Use Promise.all to run multiple promises at the same time and wait until all of them finish. It takes an array of promises and returns a new promise that resolves with an array of results when all input promises succeed, or rejects if any promise fails.
📐

Syntax

Promise.all accepts an array of promises and returns a single promise. This returned promise resolves when all input promises resolve, or rejects if any input promise rejects.

  • Promise.all(iterable): iterable is usually an array of promises.
  • Returns a promise that resolves to an array of resolved values in the same order.
javascript
Promise.all([promise1, promise2, promise3])
  .then(results => {
    // results is an array of resolved values
  })
  .catch(error => {
    // error is the first rejection reason
  });
💻

Example

This example shows how Promise.all runs three promises in parallel and waits for all to finish. It then logs all results together.

javascript
const promise1 = new Promise(resolve => setTimeout(() => resolve('First'), 1000));
const promise2 = new Promise(resolve => setTimeout(() => resolve('Second'), 2000));
const promise3 = new Promise(resolve => setTimeout(() => resolve('Third'), 1500));

Promise.all([promise1, promise2, promise3])
  .then(results => {
    console.log('All done:', results);
  })
  .catch(error => {
    console.error('One failed:', error);
  });
Output
All done: [ 'First', 'Second', 'Third' ]
⚠️

Common Pitfalls

Common mistakes when using Promise.all include:

  • Passing non-promise values without wrapping them in Promise.resolve() (though Promise.all handles this automatically).
  • Not handling rejection: if any promise rejects, Promise.all rejects immediately, so use .catch() to handle errors.
  • Expecting results in order of completion instead of order of promises passed.
javascript
const p1 = Promise.resolve('A');
const p2 = Promise.reject(new Error('Error!'));
const p3 = Promise.resolve('C');

// Wrong: no catch, will cause unhandled rejection
Promise.all([p1, p2, p3])
  .then(results => console.log(results));

// Right: handle rejection
Promise.all([p1, p2, p3])
  .then(results => console.log(results))
  .catch(error => console.error('Caught error:', error));
Output
Caught error: Error!
📊

Quick Reference

FeatureDescription
InputAn iterable (usually array) of promises or values
OutputA promise that resolves to an array of results or rejects on first error
OrderResults keep the same order as input promises
Error HandlingRejects immediately if any promise rejects
Use CaseRun multiple async tasks in parallel and wait for all

Key Takeaways

Promise.all runs multiple promises in parallel and waits for all to finish.
It resolves with an array of results in the same order as the input promises.
If any promise rejects, Promise.all rejects immediately with that error.
Always handle errors with .catch() to avoid unhandled rejections.
You can pass non-promise values; they are treated as resolved promises.