DEV Community

Kurapati Mahesh
Kurapati Mahesh

Posted on • Edited on

Promise: any vs race vs all in simple terms

#webdev #javascript #beginners #programming

In short:

Promise.all: Returns all resolved values or first rejected.

Promise.any: Returns first resolved or aggregated all errors

Promise.race: Returns first resolved or rejected

Example1:

const promise1 = Promise.resolve("Hello"); const promise2 = Promise.resolve("World"); const promise3 = Promise.resolve("!"); Promise.all([promise1, promise2, promise3]) .then((results) => console.log("Success:" + results)) .catch((error) => console.log("Error:" + error)); > Success:Hello,World,! Promise.any([promise1, promise2, promise3]) .then((results) => console.log("Success:" + results)) .catch((error) => console.log("Error:" + error)); > Success:Hello Promise.race([promise1, promise2, promise3]) .then((results) => console.log("Success:" + results)) .catch((error) => console.log("Error:" + error)); > Success:Hello
Enter fullscreen mode Exit fullscreen mode

Example2:

const promise1 = Promise.resolve("Hello"); const promise2 = Promise.resolve("World"); const promise3 = Promise.reject("!"); Promise.all([promise1, promise2, promise3]) .then((results) => console.log("Success:" + results)) .catch((error) => console.log("Error:" + error)); > Error:! Promise.any([promise1, promise2, promise3]) .then((results) => console.log("Success:" + results)) .catch((error) => console.log("Error:" + error)); > Success:Hello Promise.race([promise1, promise2, promise3]) .then((results) => console.log("Success:" + results)) .catch((error) => console.log("Error:" + error)); > Success:Hello
Enter fullscreen mode Exit fullscreen mode

Example3:

const promise1 = Promise.reject("Hello"); const promise2 = Promise.resolve("World"); const promise3 = Promise.resolve("!"); Promise.all([promise1, promise2, promise3]) .then((results) => console.log("Success:" + results)) .catch((error) => console.log("Error:" + error)); > Error:Hello Promise.any([promise1, promise2, promise3]) .then((results) => console.log("Success:" + results)) .catch((error) => console.log("Error:" + error)); > Success:World Promise.race([promise1, promise2, promise3]) .then((results) => console.log("Success:" + results)) .catch((error) => console.log("Error:" + error)); > Error:Hello
Enter fullscreen mode Exit fullscreen mode

Example4:

const promise1 = Promise.reject("Hello"); const promise2 = Promise.reject("World"); const promise3 = Promise.reject("!"); Promise.all([promise1, promise2, promise3]) .then((results) => console.log("Success:" + results)) .catch((error) => console.log("Error:" + error)); > Error:Hello Promise.any([promise1, promise2, promise3]) .then((results) => console.log("Success:" + results)) .catch((error) => console.log("Error:" + error)); > Error:AggregateError: All promises were rejected Promise.race([promise1, promise2, promise3]) .then((results) => console.log("Success:" + results)) .catch((error) => console.log("Error:" + error)); > Error:Hello
Enter fullscreen mode Exit fullscreen mode

Please do add any more scenarios you came across.

Thanks.

Top comments (1)

Collapse
 
ant_f_dev profile image
Anthony Fung •

Thanks for the summary.

I use Promise.all quite regularly, e.g. getting data from more than one API call and combining the data.

What might be good use cases for Promise.any and Promise.race?