TypeScript - Promise.race()

The Promise.race() static method takes an iterable of promises as input and returns a single Promise. This returned promise settles with the eventual state of the first promise that settles (either fulfilled or rejected).

It's useful when you want the first async task to complete, but do not care about its eventual state (i.e. it can either succeed or fail).

Lets see an example:

const promise1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 300, 'promise1 value');
});

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

Promise.race([promise1, promise2]).then((value) => {
     // promise2 is faster, so the 'value' will be the result of promise2
   console.log(value);
});

Output will be :

promise2 value

In this example, both promises will get resolved, but since the promise2 is faster (with less waiting time), the Promise.race() method will return promise2, it is the first promise in the input list which get settled (rejected or resolved).

If the iterable contains one or more non-promise values and/or an already settled promise, then Promise.race() will settle to the first of these values found in the iterable.

See this example:

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

const promise2 = new Promise((resolve, reject) => {
  reject('promise2 rejected');
});

Promise.race([promise1, promise2])
.then((value) => {
  console.log(value);
})
// promise2 is already settled (rejected), 
// so the 'error' will be the rejection-error of promise2
.catch((error) => { console.error(error);})
;

Output will be :

promise2 rejected

Since promise2 is already settled (rejected), Promise.race() method will return promise2.

References:

• MDN Web Docs - Promise.race()

Related Post(s):

• JavaScript - What is Promise
• TypeScript - Promise.all()
• TypeScript - Promise.allSettled()
• TypeScript - Promise.any()

TypeScript - Promise.any()

The Promise.any() method is useful for returning the first promise that fulfills. It short-circuits after a promise fulfills, so it does not wait for the other promises to complete once it finds one.

This method returns the first fulfilled value and ignores all rejected promises up until the first promise that fulfills. This can be beneficial if we need only one promise to fulfill but we do not care which one does.

Lets see an example:

const p1 = Promise.reject("some error");
const p2 = Promise.resolve("resolve value1");
const p3 = Promise.resolve("resolve value2");

const promises = [p1, p2, p3];

(Promise as any).any(promises)
.then((value) => console.log(value))
.catch((error) => { console.error(error.message);});

Output will be :

resolve value1

In this example, the first promise p1 is rejected, but Promise.any method ignores this and continue to the next promise p2 which get resolved/fulfilled. Once it finds the first fulfilled promise it stops processing further promises.

If all of the input promises are rejected, then it rejects with an AggregateError containing an array of rejection reasons.

See this example:

const p1 = Promise.reject("some error1");
const p2 = Promise.reject("some error2");
const p3 = Promise.reject("some error3");

const promises = [p1, p2, p3];

(Promise as any).any(promises)
.then((value) => console.log(value))
.catch((error) => { console.error(error);});

Output will be :

[AggregateError: All promises were rejected] {
  [errors]: [ 'some error1', 'some error2', 'some error3' ]
}

When all of the input promises are rejected, it generates the AggregateError (array of the rejection error from each input promise).

References:

• MDN Web Docs - Promise.any()

Related Post(s):

• JavaScript - What is Promise
• TypeScript - Promise.all()
• TypeScript - Promise.allSettled()
• TypeScript - Promise.race()