Promise functions: Promise.all(), Promise.race(), Promise.any()

Promise functions: Promise.all(), Promise.race(), Promise.any()

2023-02-04
3 min read

Promise.all()

Promise.all() takes parameter, list of Promise Object as an iterable object. Promise.all() method is a single promise that resolves when all input promises have been resolved. Promise.all() method calls all promise in list at the same time.

js
const pOne = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, "One");
});

const pTwo = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, "Two");
});

Promise.all([pOne, pTwo]).then((value) => {
  console.log(value);
}).catch((err) => console.error(err))

Output

text
["one", "Two"]

It will take a second because Promise.all() method runs all promises simultaneously.

Promise.all() - speed

Regardless timeout, Promise.all() methods displays results according to order of iterator.

js
const pSlow = new Promise((resolve, reject) => {
  setTimeout(resolve, 500, "Slow");
});

const pFast = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, "Fast");
});

Promise.all([pSlow, pFast]).then((value) => {
  console.log(value);
}).catch((err) => console.error(err))

Output

text
["Slow", "Fast"]

"pSlow" promise is slower than "pFast" promise, but it displays text "Slow" at the first.

Promise.all() - Reject

If there is more than one reject promise function, Promise.all() throws error

js
const pOne = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, "One");
});

const pTwo = new Promise((resolve, reject) => {
  setTimeout(resolve, 200, "Two");
});

const pErr = new Promise((resolve, reject) => {
  reject(new Error("Reject"));
});

Promise.all([pOne, pTwo, pErr]).then((value) => {
  console.log(value);
}).catch((err) => console.error(err))

Output

text
Reject

Promise.all() methods catch error(reject) immediately when one of input promises rejects.

Promise.any()

Promise.any() takes parameter, list of Promise Object as an iterable object. If there is any fulfilled iterable promise Object in Promise.any(), it returns a single promise that resolves to a value.

js
const pErr = new Promise((resolve, reject) => {
  reject(new Error("Reject1"));
});

const pSlow = new Promise((resolve, reject) => {
  setTimeout(resolve, 500, "Slow");
});

const pFast = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, "Fast");
});

Promise.any([pErr, pSlow, pFast]).then((value) => {
  console.log(value);
}).catch((err) => console.error(err))

Output

text
"Fast"

Even though "pErr" rejected for the first time, it displays "Fast" which is fulfilled firstly.

Promise.race()

Promise.race() takes parameter, list of Promise Object as an iterable object. Promise.race() static method settles with the eventual state of the first promise that settles. Promise.race() returns fasted result.

js
const pSlow = new Promise((resolve, reject) => {
  setTimeout(resolve, 500, "Slow");
});

const pFast = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, "Fast");
});

Promise.race([pSlow, pFast]).then((value) => {
  console.log(value);
}).catch((err) => console.error(err))

Output

text
"Fast"

"pSlow" promise will be resolved after 500 ms. On the other hands, "pFast" promise will be resolved after 100ms. Lastly, Promise.race() only display result of "pFast" promise because "pFast" promise is faster than "pSlow" promise.

Promise.race() - Error

Promise.race() method will catch error immediately. This way is similar to Promise.all() mentioned above.

js
const pErr = new Promise((resolve, reject) => {
  reject(new Error("Reject"));
});

const pSlow = new Promise((resolve, reject) => {
  setTimeout(resolve, 500, "Slow");
});

const pFast = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, "Fast");
});

Promise.race([pSlow, pFast, pErr]).then((value) => {
  console.log(value);
}).catch((err) => console.error(err));

Output

text
"Reject"

Output is same as output of Promise.all().

ref

Free open source project made by Youngjin