4 Promise Methods You Should Know

Hello guys , I have you all are doing well . In this blog we will be talking about few promise methods . And I hope you will each one of these promise methods in Javascript . Before diving into this I assume that you have basic understanding of promise .

Promise.all() :

It takes an array of promise as an argument and returns a single promise . And this returned promise will get resolved once all the promises inside that array is resolved.
If an empty array is passed as an argument then it returns already resolved value empty array .
Even if the single promise gets rejected then the promise returned will instantly reject with this first rejection message / errorr , without checking any further promises inside that array.

Lets understand this method with the help of code :

example 1 :
const promise1 = Promise.resolve(3);
const promise2 = 42;
const promise3 = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, 'foo');
});

Promise.all([promise1, promise2, promise3]).then((values) => {
  console.log(values);
});
// expected output: Array [3, 42, "foo"]

example 2 :

const p1 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('one'), 1000);
});
const p2 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('two'), 2000);
});
const p3 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('three'), 3000);
});
const p4 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('four'), 4000);
});
const p5 = new Promise((resolve, reject) => {
  reject(new Error('reject'));
});

// Using .catch:
Promise.all([p1, p2, p3, p4, p5])
.then(values => {
  console.log(values);
})
.catch(error => {
  console.error(error.message)
});

//From console:
//"reject"

example 3
Promise.all([]).then((res) => console.log(res));
//Expected Output : []

Promise.allSettled() :

Just like Promise.all() , It also takes an array of promise as an argument and returns a single promise the only difference is that it waits for all the promises inside array to get fullfilled or rejected .
If an empty array is passed as an argument then it returns already resolved value empty array .

The outcome which we get inside array :

{status : 'fulfilled', value : result} when resolved, {status : 'rejected', reason : error} when rejected.

Lets try to understand this with the help of code

Promise.allSettled([
  Promise.resolve(33),
  new Promise(resolve => setTimeout(() => resolve(66), 0)),
  99,
  Promise.reject(new Error('an error'))
])
.then(values => console.log(values));

// [
//   {status: "fulfilled", value: 33},
//   {status: "fulfilled", value: 66},
//   {status: "fulfilled", value: 99},
//   {status: "rejected",  reason: Error: an error}
// ]

Promise.any() :

It takes an iterable array and returns a resolved promise as soon as any one of the promise gets resolved .
If none of the promises inside array gets fullfilled then the returned promise is rejected with an AggregateError - a special Error Object that stores all promise errors in its errors property.
If an empty array is passed as an argument then the promise is rejected asynchronously with an AggregateError object whose errors property is an empty array.

Lets try to understand this with the help of code

example 1 :

const promise1 = Promise.reject(0);
const promise2 = new Promise((resolve) => setTimeout(resolve, 100, 'quick'));
const promise3 = new Promise((resolve) => setTimeout(resolve, 500, 'slow'));

const promises = [promise1, promise2, promise3];

Promise.any(promises).then((value) => console.log(value));

// expected output: "quick"

example 2 :

const pErr = new Promise((resolve, reject) => {
  reject("Always fails");
});

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

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

Promise.any([pErr, pSlow, pFast]).then((value) => {
  console.log(value);
  // pFast fulfills first
})
// expected output: "Done quick"

Promise.race() :

This methods returns a resolved promise as soon as any promise gets fullfilled or rejected with reason of rejection when rejected or value when promise is fullfilled.
when an empty array is passed then the method will return a promise which will be forever pending.

Lets try to understand this with the help of code

example :
const promise1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 500, 'one');
});

const promise2 = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, 'two');
});

Promise.race([promise1, promise2]).then((value) => {
  console.log(value);
  // Both resolve, but promise2 is faster
});
// expected output: "two"

Reference :

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all

4 Promise Methods You Should Know

Table of contents

Promise.all() :

Promise.allSettled() :

Promise.any() :

Promise.race() :

Reference :