How to wait for multiple Promises?

In some use cases in Node.js it's needed to execute multiple asynchronous operations concurrently and wait for them all to complete, because the combined result has to be processed. An example of this would be to wait for multiple API calls to finish before collecting all results and create a new combined API call. There are several ways to accomplish this. You can do this with the async/await and try/catch pattern or with thePromise.all() method. This blog article is about the latter one.

For an overview of promises in Node.js have a look at the article: Promises in Node.js

Promise.all(iterable)

Promise.all waits for all fulfillments (or the first rejection).

• Syntax: Promise.all(iterable)
• Parameters: iterable - An iterable object such as an Array.

What is Promise.all?

The Promise.all() method takes an iterable of promises as an input (commonly an array), and returns a single Promise that resolves to an array of the results of the input promises.

This returned Promise will resolve when all the input promises have resolved , or if the input iterable contains no promises.

It rejects immediately upon any of the input promises rejecting or non-promises throwing an error , and will reject with this first rejection message / error.

How to use Promise.all

The Promise.all method needs an iterable as an input, an array with promises and it will behave as a single Promise. So we can add a .then handler to handle the returned Promise, which will receive the result of the resolved Promises. To catch and handle potential errors a catch handler should be attached as well.

Let's look at an example. We create 3 promises each with a different timeout. When all promises are resolved, it should output the combined response.

const all = Promise.all([
  new Promise((resolve, reject) =>
    setTimeout(() => resolve(1), 1000),
  ),
  new Promise((resolve, reject) =>
    setTimeout(() => resolve(2), 2000),
  ),
  new Promise((resolve, reject) =>
    setTimeout(() => resolve(3), 3000),
  ),
]).catch(err => console.log('Promise was rejected!', err));

all.then(results => console.log(results)); // the output is: [1, 2, 3]

Please note that all inner Promises are started at the same time , so it takes 3 seconds instead of 6 seconds (1+2+3).

Example with node-fetch

Let's look at a more real example. We make a request for each element in an array. In the example we are going to request five todos based on their id from a placeholder API.

Create a project folder.

mkdir node-promise-all

Initialize project with npm init -y to be able to install node packages.

cd node-organize
npm init -y

Install node-fetch to make fetch requests.

npm install node-fetch

Create an index.js file.

touch index.js

Add code.

// import node-fetch
const fetch = require('node-fetch');
// set url as constant
const URL = 'https://jsonplaceholder.typicode.com/todos';
const ids = [1, 2, 3, 4, 5];

// create a request for each todo id and decode as json.
// json() returns a Promise
const getTodo = id =>
  fetch(`${URL}/${id}`).then(response => response.json());

// Map over the ids, returning a promise for each one.
const arrayOfPromises = ids.map(id => getTodo(id));

// create a single Promise for all the Promises
Promise.all(arrayOfPromises)
  .then(todos => todos.map(todo => todo.title))
  .then(titles => console.log(titles)) // logs titles from all the todos
  .catch(err => console.log(err));

Fault-tolerant Promise.all

If one Promise in the iterable object throws an error, all other Promises will be halted and if there have been already successfully made requests the results will not be returned. To still receive the result from Promise.all in a case where some Promises reject, we need to make the Promise.all utility fault tolerant.

To avoid losing the other responses, a catch handler can be attached to the individual Promises. This way we are catching the errors they might throw, instead of letting them bubble up to the Promise.all, which will cause the Promise to reject. The code could look something like this:

const promises = [
  fetch(url),
  fetch(url),
  Promise.reject(new Error('This fails!')),
  fetch(url),
];
const allPromisesWithErrorHandler = promises.map(promise =>
  promise.catch(error => error),
);

Promise.all(allPromisesWithErrorHandler).then(results => {
  // we get results even if a promise returns rejected!
  // But results can be a mix of errors and success values.
  console.log(results);
});

TL;DR

• Promise.all is useful to make several asynchronous calls and collect all their results together.
• The method Promise.all waits for all fulfillments (or the first rejection).
• When writing async code Promise.all helps us to write cleaner and maintainable code.

Thanks for reading and if you have any questions , use the comment function or send me a message @mariokandut.

If you want to know more about Node, have a look at these Node Tutorials.

References (and Big thanks):

HeyNode,node-fetch,MDN - Promise.all()

Comments

[Andreas Brain]

Since Node.js 12.9.0, there is a fault-tolerant version of Promise.all() available out of the box: Promise.allSettled(). Browser support seems also quite good, but not 100 %.

[Mario]

Promise.allSettled is another way to handle multiple promises. The difference is that Promise.all rejects as soon one rejects, Promise.allSettled() returns a promise that resolves after all have rejected or resolved. This means it is more fault-tolerant, you can achieve the same with adding a catch handler to the promise.all, see example in article. I think I will add an article about the difference Promise.all and Promise.allSettled. Thanks for the constructive input.