🏁 Promise.race() Implementation

jspromisesmedium

Promise.race() returns a promise that settles as soon as any of the input promises settles—whether it resolves or rejects. The first promise to complete "wins the race" and determines the outcome.

🧠 Understanding Promise.race

Atom 1: Purpose

Promise.race returns a promise that settles as soon as any input promise settles — resolved or rejected.

First one wins — race ends immediately.

Atom 2: Inputs

Takes an iterable (usually an array) of promises or values
Wrap each with Promise.resolve() to normalize non-promises

Atom 3: Core Logic

Attach .then(resolve) and .catch(reject) to each input
As soon as any one settles , resolve/reject outer promise
Ignore later results

Atom 4: Edge Case

If input is empty , the returned promise never settles

✅ Implementation: `promiseRace`

function promiseRace(iterable) {
  return new Promise((resolve, reject) => {
    for (const item of iterable) {
      Promise.resolve(item)
        .then(resolve)
        .catch(reject);
    }
  });
}

🧪 Example:

const p1 = new Promise((res) => setTimeout(() => res("one"), 500));
const p2 = new Promise((res) => setTimeout(() => res("two"), 100));

promiseRace([p1, p2]).then(console.log); // → "two"

⚠️ Example with Rejection:

const p1 = new Promise((_, rej) => setTimeout(() => rej("fail"), 50));
const p2 = new Promise((res) => setTimeout(() => res("win"), 100));

promiseRace([p1, p2])
  .then(console.log)
  .catch(console.error); // → "fail"

Quick Quiz

Test your understanding with 3 quick questions

Q1What determines whether Promise.race resolves or rejects?

Q2What happens when Promise.race is passed an empty array?

Q3Which is a common use case for Promise.race?

🏁 Promise.race() Implementation

jspromisesmedium

🧠 Understanding Promise.race

Atom 1: Purpose

Promise.race returns a promise that settles as soon as any input promise settles — resolved or rejected.

First one wins — race ends immediately.

Atom 2: Inputs

Takes an iterable (usually an array) of promises or values
Wrap each with Promise.resolve() to normalize non-promises

Atom 3: Core Logic

Attach .then(resolve) and .catch(reject) to each input
As soon as any one settles , resolve/reject outer promise
Ignore later results

Atom 4: Edge Case

If input is empty , the returned promise never settles

✅ Implementation: `promiseRace`

function promiseRace(iterable) {
  return new Promise((resolve, reject) => {
    for (const item of iterable) {
      Promise.resolve(item)
        .then(resolve)
        .catch(reject);
    }
  });
}

🧪 Example:

const p1 = new Promise((res) => setTimeout(() => res("one"), 500));
const p2 = new Promise((res) => setTimeout(() => res("two"), 100));

promiseRace([p1, p2]).then(console.log); // → "two"

⚠️ Example with Rejection:

const p1 = new Promise((_, rej) => setTimeout(() => rej("fail"), 50));
const p2 = new Promise((res) => setTimeout(() => res("win"), 100));

promiseRace([p1, p2])
  .then(console.log)
  .catch(console.error); // → "fail"

Quick Quiz

Test your understanding with 3 quick questions

Q1What determines whether Promise.race resolves or rejects?

Q2What happens when Promise.race is passed an empty array?

Q3Which is a common use case for Promise.race?

🏁 Promise.race() Implementation

🧠 Understanding Promise.race

Atom 1: Purpose

Atom 2: Inputs

Atom 3: Core Logic

Atom 4: Edge Case

✅ Implementation: promiseRace

🧪 Example:

⚠️ Example with Rejection:

Continue Reading

🛑 AbortController: Canceling Async Operations in JavaScript

🔒 Closures in JavaScript — The Complete Guide

📦 Understanding ES6 Modules in JavaScript

🏁 Promise.race() Implementation

🧠 Understanding Promise.race

Atom 1: Purpose

Atom 2: Inputs

Atom 3: Core Logic

Atom 4: Edge Case

✅ Implementation: promiseRace

🧪 Example:

⚠️ Example with Rejection:

Continue Reading

🛑 AbortController: Canceling Async Operations in JavaScript

🔒 Closures in JavaScript — The Complete Guide

📦 Understanding ES6 Modules in JavaScript

✅ Implementation: `promiseRace`

✅ Implementation: `promiseRace`