Promise Combinators: Common Mistakes in JavaScript

Promise Combinators: Common Mistakes in JavaScript

Promise combinators have common mistakes. Here is each one and how to avoid it.

Mistake 1: Using Promise.all When You Want Partial Success

// bad: one failure rejects everything
const [a, b, c] = await Promise.all([fetchA(), fetchB(), fetchC()]);

// good: use allSettled for partial success
const results = await Promise.allSettled([fetchA(), fetchB(), fetchC()]);
``
### Mistake 2: Forgetting Promise.race Can Reject

```js
// race returns the first to settle, which could be a rejection
const result = await Promise.race([fetchA(), fetchB()]);
// could throw if the first to settle is a rejection

// use any if you want the first success (ignore rejections)
const result = await Promise.any([fetchA(), fetchB()]);
``
### Mistake 3: Not Handling AggregateError with Promise.any

```js
// bad: not catching AggregateError
const result = await Promise.any([fetchA(), fetchB(), fetchC()]);

// good: catch and inspect errors
try {
  const result = await Promise.any([fetchA(), fetchB(), fetchC()]);
} catch (err) {
  console.error("All failed:", err.errors); // AggregateError
}
``
### Mistake 4: Promise.race([]) Never Settles

```js
// bad: never settles (hangs forever)
const result = await Promise.race([]);

// fix: check that the array is not empty
if (promises.length > 0) {
  const result = await Promise.race(promises);
}
``
### Mistake 5: Not Clearing Timers in Race

```js
// bad: timer keeps running (memory leak)
const result = await Promise.race([
  fetch("/api"),
  new Promise((_, reject) => setTimeout(() => reject(new Error("timeout")), 5000)),
]);
// the timer is still running even after the race settles

// good: clear the timer
let timer;
try {
  const result = await Promise.race([
    fetch("/api"),
    new Promise((_, reject) => {
      timer = setTimeout(() => reject(new Error("timeout")), 5000);
    }),
  ]);
  clearTimeout(timer);
  return result;
} catch (err) {
  clearTimeout(timer);
  throw err;
}
``
### Mistake 6: Expecting Promise.all to Cancel Other Promises

```js
// Promise.all does not cancel the other promises when one rejects
// they continue running; their results are just ignored
``
For actual cancellation, use `AbortController` with `fetch`.

### The Takeaway

Common mistakes: using `Promise.all` when you want partial success (use `allSettled`), forgetting `race` can reject (use `any` for first success), not handling `AggregateError` with `any`, `race([])` never settles, not clearing timers, and expecting `Promise.all` to cancel other promises (it does not).