In Promise.race(), what is the fate of promises that don't come out on top

Question

In Promise.race(), what is the fate of promises that don't come out on top

Promise.race(promise1, promise2, ...)

function returns a promise that resolves or rejects based on the fastest promise from the input list.

But what happens to the promises that do not win the race?

My experiments with Node.js suggest that they keep running in the background.

It seems like there is no mechanism to forcefully terminate a promise. Is this understanding accurate?

javascript promise

Answer 1

Answer №1

Every promise in a race continues to run even after the first one finishes -

const sleep = ms =>
  new Promise(r => setTimeout(r, ms))

async function runner (name) {
  const start = Date.now()
  console.log(`${name} sets off on the race`)
  await sleep(Math.random() * 5000)
  console.log(`${name} completes the race`)
  return { name, delta: Date.now() - start }
}

const runners =
  [ runner("Alice"), runner("Bob"), runner("Claire") ]

Promise.race(runners)
  .then(({ name }) => console.log(`!!!${name} is the winner of the race!!!`))
  .catch(console.error)
  
Promise.all(runners)
  .then(JSON.stringify)
  .then(console.log, console.error)

Alice sets off on the race
Bob sets off on the race
Claire sets off on the race
Claire completes the race
!!!Claire is the winner of the race!!!
Alice completes the race
Bob completes the race

[ 
  {"name":"Alice","delta":2158},
  {"name":"Bob","delta":4156},
  {"name":"Claire","delta":1255}
]

Answer 2

Every promise in a race continues to run even after the first one finishes -

const sleep = ms =>
  new Promise(r => setTimeout(r, ms))

async function runner (name) {
  const start = Date.now()
  console.log(`${name} sets off on the race`)
  await sleep(Math.random() * 5000)
  console.log(`${name} completes the race`)
  return { name, delta: Date.now() - start }
}

const runners =
  [ runner("Alice"), runner("Bob"), runner("Claire") ]

Promise.race(runners)
  .then(({ name }) => console.log(`!!!${name} is the winner of the race!!!`))
  .catch(console.error)
  
Promise.all(runners)
  .then(JSON.stringify)
  .then(console.log, console.error)

Alice sets off on the race
Bob sets off on the race
Claire sets off on the race
Claire completes the race
!!!Claire is the winner of the race!!!
Alice completes the race
Bob completes the race

[ 
  {"name":"Alice","delta":2158},
  {"name":"Bob","delta":4156},
  {"name":"Claire","delta":1255}
]

Answer 3

Answer №2

While the race metaphor may not be meant to be taken literally, it can be understood in the following way:

Think of the runner as an asynchronous process (such as fetching a document from a web server or database, awaiting user input, or simply waiting for time to pass).
The promise acts as a time-keeper that notifies when the runner crosses the finish line (when the document or user input is available, or when the designated time has elapsed).
The winner of the race is determined by the first time-keeper that announces the result (also known as the winning time).

Even after one race is won, other time-takers (aside from the one declaring the victory) must still monitor their runners¹, as they might be participating in another race where they could emerge victorious. An example is provided below.

var over;
function runner(ms) {
  return new Promise(function timetaker(resolve, reject) {
    setTimeout(function() {
      if (!over) resolve(`Finished after ${ms} ms`);
    }, ms);
  });
}
function endofrace(result) {
  console.log(result);
  //over = true;
}
var veryslow = runner(2000);
var slow = runner(1000);
var fast = runner(500);
Promise.race([slow, fast]).then(endofrace);
Promise.race([slow, veryslow]).then(endofrace);

To prevent certain behaviors ("disqualifying losers from other races"), you need to implement "race-is-over" awareness into the promise, similar to the over variable in the example. By uncommenting the specified line, the racer with a duration of 1000 ms will no longer have a chance to win the second race.

(Specifically, if over = true, the runner's setTimeout will still complete, but the time-keeper will cease reporting further results. The awareness of the race being over lies with the time-keeper, not the runner. Alternatively, in the context of a web server request, the race-is-over awareness could reside with the runner to abort the request once the race concludes.)

¹ Another limitation of the metaphor: It is inaccurate to assume that time-takers (promises) consume resources while observing the runners.

Answer 4

While the race metaphor may not be meant to be taken literally, it can be understood in the following way:

Think of the runner as an asynchronous process (such as fetching a document from a web server or database, awaiting user input, or simply waiting for time to pass).
The promise acts as a time-keeper that notifies when the runner crosses the finish line (when the document or user input is available, or when the designated time has elapsed).
The winner of the race is determined by the first time-keeper that announces the result (also known as the winning time).

Even after one race is won, other time-takers (aside from the one declaring the victory) must still monitor their runners¹, as they might be participating in another race where they could emerge victorious. An example is provided below.

var over;
function runner(ms) {
  return new Promise(function timetaker(resolve, reject) {
    setTimeout(function() {
      if (!over) resolve(`Finished after ${ms} ms`);
    }, ms);
  });
}
function endofrace(result) {
  console.log(result);
  //over = true;
}
var veryslow = runner(2000);
var slow = runner(1000);
var fast = runner(500);
Promise.race([slow, fast]).then(endofrace);
Promise.race([slow, veryslow]).then(endofrace);

To prevent certain behaviors ("disqualifying losers from other races"), you need to implement "race-is-over" awareness into the promise, similar to the over variable in the example. By uncommenting the specified line, the racer with a duration of 1000 ms will no longer have a chance to win the second race.

(Specifically, if over = true, the runner's setTimeout will still complete, but the time-keeper will cease reporting further results. The awareness of the race being over lies with the time-keeper, not the runner. Alternatively, in the context of a web server request, the race-is-over awareness could reside with the runner to abort the request once the race concludes.)

¹ Another limitation of the metaphor: It is inaccurate to assume that time-takers (promises) consume resources while observing the runners.

In Promise.race(), what is the fate of promises that don't come out on top

Answer №1

Answer №2

Similar questions

Obtaining user data in Angular post login

Adding a fresh element and removing the initial item from a collection of Objects in JavaScript

React: The error message "p is not defined" is showing up in the component file due to the no-undef

Element dynamically targeted

What is the best way to conceal a Boostrap Navbar using jQuery?

Encountering issues when setting fitbounds beyond the scope of a jquery.each()

Using a percentage width on a <div> element with the "overflow-x: scroll" property does not seem to be functioning properly, even when encapsulated within

Customizing content based on Route - Utilizing Node.js/React

Utilize the power of PIXI.js to effortlessly convert your canvas into a high-quality image without encountering

React Native: A guide to triggering a modal or action sheet when a button tab is clicked using Wix React Native navigation

Express JS get method causing browser tab to hang with continuous loading

Problems with Angular functionality

Execute Cheerio selector once the page has finished loading

ReactJS encountered an error of type ERR_INVALID_ARG_TYPE

Transmit information between controllers during pageload in AngularJS without utilizing $rootscope

Exploring the world of JSON files using JavaScript

Building a dynamic form in React: Fetching select data from an API, posting to another API, and automatically clearing fields upon submission

Refreshing data attribute following an ajax request

Vue: Conditionally display a division depending on v-if, excluding cases where the div returns null

Hiding labels using JQuery cannot be concealed