JavaScript为何未提供原生方式在单个Promise失败时取消Promise.all？如何终止Promise.all中剩余异步操作？

Great question! You're absolutely right that Promise.all rejects immediately when any promise fails, but the remaining promises keep running in the background. Let's break down your two main questions:

Is there a built-in method or recommended pattern to cancel remaining async operations? #

JavaScript doesn't have a native Promise.all variant that automatically cancels remaining tasks on rejection, but there are two widely recommended patterns depending on your use case:

1. Use AbortController for fetch (and other signal-aware APIs) #

If you're working with fetch (or other modern APIs that support AbortSignal), this is the cleanest native solution. AbortController lets you send a cancellation signal to all attached tasks, terminating them immediately when needed.

Here's how to implement it:

const controller = new AbortController();
const { signal } = controller;

// Wrap each fetch with a catch that triggers cancellation on failure
const promises = [
  fetch("/api/1", { signal }),
  fetch("/api/2", { signal }),
  fetch("/api/3", { signal })
].map(promise => 
  promise.catch(err => {
    // Don't abort if the error is already an abort signal
    if (err.name !== "AbortError") {
      controller.abort();
    }
    throw err;
  })
);

try {
  const results = await Promise.all(promises);
  // Handle successful results
} catch (err) {
  if (err.name !== "AbortError") {
    console.error("Request failed:", err);
    // Handle business logic errors here
  }
}

2. Custom cancelable promise wrapper for custom async tasks #

If you're dealing with custom async functions (like timers or database calls), you can create a wrapper that adds cancellation logic:

// Helper to create a cancelable task
function createCancelableTask(taskFn) {
  let cancel;
  const promise = new Promise((resolve, reject) => {
    cancel = () => reject(new Error("Task canceled"));
    // Pass resolve, reject, and cancel to the task function
    taskFn(resolve, reject, cancel);
  });
  return { promise, cancel };
}

// Example usage
const task1 = createCancelableTask((resolve) => setTimeout(() => resolve("API 1 done"), 2000));
const task2 = createCancelableTask((resolve) => setTimeout(() => resolve("API 2 done"), 1000));
const task3 = createCancelableTask((_, reject) => setTimeout(() => reject("API 3 failed"), 500));

const tasks = [task1, task2, task3];
let isCanceled = false;

try {
  await Promise.all(tasks.map(({ promise }) => 
    promise.catch(err => {
      if (!isCanceled) {
        isCanceled = true;
        // Cancel all remaining tasks
        tasks.forEach(task => task.cancel());
      }
      throw err;
    })
  ));
} catch (err) {
  console.error(err);
}

Why doesn't JavaScript have a native way to cancel Promise.all on first rejection? #

This boils down to core design principles and practical trade-offs:

• Promise immutability: A core rule of native Promises is that once created, their state (pending/fulfilled/rejected) is irreversible. Adding cancellation would break this invariant, introducing significant complexity to the Promise spec.
• No universal cancellation logic: Async operations vary wildly (network requests, timers, file I/O, etc.), each with their own cancellation requirements. A one-size-fits-all native solution wouldn't work for every scenario.
• Historical and compatibility reasons: Early discussions of Promise cancellation (like the TC39 cancellation proposal) were dropped due to complexity and lack of consensus. Instead, the team opted for targeted solutions like AbortController that work with specific APIs, avoiding breaking changes to existing code.
• Flexibility over rigidity: By leaving cancellation to developers, JavaScript lets you tailor the logic to your exact use case, rather than forcing a generic solution that might not fit your needs.

内容的提问来源于stack exchange，提问作者user32623614