Advanced JavaScript Promise Patterns: Async Control Flow Mastery

Tue, 05 Dec 2023 00:00:00 +0900

Promises are fundamental to modern JavaScript, but mastering asynchronous control flow requires going beyond basic .then() chains. This article explores advanced Promise patterns that intermediate to senior developers need for production applications, from concurrency control to error handling and cancellation.

The Promise Landscape Beyond Basics

JavaScript provides four static methods on Promise for composing async operations, each suited to different scenarios:

Method	Resolves When	Rejects When	Use Case
`Promise.all`	All promises resolve	Any promise rejects	Parallel API calls, all required
`Promise.allSettled`	All promises settle	Never	Mixed results, log all outcomes
`Promise.race`	First promise settles	First promise rejects	Timeout race conditions
`Promise.any`	First promise resolves	All promises reject	First-successful-response pattern

const results = await Promise.allSettled([
 fetch("/api/users").then(r => r.json()),
 fetch("/api/posts").then(r => r.json()),
 fetch("/api/comments").then(r => r.json()),
]);
const successful = results.filter(r => r.status === "fulfilled").map(r => r.value);

Promise.allSettled is particularly useful when you need to process partial results even if some operations fail, such as batch data synchronization where individual record failures should not abort the entire batch.

Promise on Commentary of Takao

Advanced JavaScript Promise Patterns: Async Control Flow Mastery

The Promise Landscape Beyond Basics