Promise.all、Promise.allSettled、Promise.any、Promise.race

<think>嗯，用户现在想了解Promise的不同方法及其用法，特别是all、allSettled、any和race的区别和使用场景。之前他们可能已经了解过async/await和.then()的区别，现在进一步深入Promise的组合方法。我需要根据提供的引用内容来组织回答，确保准确性和相关性。 首先，用户提供的引用已经详细说明了这四个方法的特点，比如Promise.all在所有成功时返回结果，否则拒绝；allSettled无论成功失败都返回状态；any等待第一个成功，全部失败才拒绝；race则是第一个敲定的结果。需要将这些信息结构化，比较它们的区别，并给出使用场景和代码示例。 接下来，我需要确认每个方法的参数、返回值、行为以及错误处理方式。比如，Promise.all和Promise.race在遇到第一个reject时可能会立即终止，而allSettled会等待所有完成。any则在第一个成功时解决，否则在所有失败后拒绝。这些都需要明确说明。 然后，考虑用户可能的应用场景。例如，Promise.all适合并行处理多个相互依赖的请求，allSettled适合无论成功失败都需要结果的场景，比如批量请求后处理数据。any可能适用于快速获取任一可用资源，比如从多个镜像服务器获取数据。race适用于超时控制或竞速场景。 还要注意代码示例的正确性，根据引用中的例子进行调整，确保语法正确，并符合用户提到的格式要求，比如行内公式用$...$，独立公式用$$...$$，但这里可能更多是代码块。需要检查代码示例是否清晰，并正确对应每个方法的行为。 另外，用户之前的讨论涉及async/await和.then()，可能在回答中可以适当关联，比如结合使用这些Promise方法与async/await，但当前问题主要关注四个方法的区别，所以重点应放在这里。 需要确保回答结构清晰，可能分为核心区别、方法详解、对比表格、使用场景和常见误区等部分。同时，根据用户提供的引用，正确标注引用标记，比如[^1]、[^2]等，但用户提供的引用标记可能已经存在，需要对应正确的内容。 最后，生成相关问题，帮助用户进一步学习，比如错误处理的最佳实践，或者如何结合async/await使用这些方法。需要确保问题与当前主题相关，并引导用户深入理解。</think>#### Promise组合方法对比与应用指南 ### #### 一、核心区别对比表 | 方法 | 触发条件 | 返回结果形式 | 失败处理特性 | |-----------------------|-----------------------------------|----------------------------|------------------------------| | `Promise.all` | **全部成功**时触发 | 数组（按顺序存储结果） | 任一失败立即终止[^1] | | `Promise.allSettled` | **所有状态确定**后触发 | 对象数组（含status标记）[^3]| 不因失败终止 | | `Promise.any` | **任意一个成功**即触发 | 首个成功的结果 | 全部失败抛出AggregateError[^2]| | `Promise.race` | **首个状态确定**即触发（无论成败）| 首个完成的结果 | 立即响应最快完成的Promise | ### #### 二、方法详解与代码示例 1. **Promise.all** ```javascript // 并行请求三个API const fetchUser = fetch('/api/user'); const fetchOrders = fetch('/api/orders'); const fetchSettings = fetch('/api/settings'); Promise.all([fetchUser, fetchOrders, fetchSettings]) .then(([user, orders, settings]) => { console.log('所有数据加载完成'); initDashboard(user, orders, settings); }) .catch(error => { console.error('至少一个请求失败', error); // 任意请求失败立即触发 }); ``` **场景**：用户数据看板初始化需要同时获取用户信息、订单记录和设置项[^1] 2. **Promise.allSettled** ```javascript // 批量更新商品库存状态 const updateRequests = products.map(product => updateStock(product.id).catch(e => ({sku: product.id, error: e})) ); Promise.allSettled(updateRequests) .then(results => { const failedUpdates = results.filter(r => r.status === 'rejected'); if (failedUpdates.length > 0) { sendErrorReport(failedUpdates); // 收集所有失败记录 } }); ``` **场景**：电商后台批量库存更新需完整结果统计[^3] 3. **Promise.any** ```javascript // 多CDN镜像源择优 const cdnSources = [ fetch('https://cdn1.example.com/data'), fetch('https://cdn2.example.net/data'), fetch('https://cdn3.example.org/data') ]; Promise.any(cdnSources) .then(response => { showContent(response); // 使用最先响应的可用资源 }) .catch(() => { displayFallbackContent(); // 所有CDN均不可用时显示备用内容 }); ``` **场景**：提高资源加载速度的容灾方案[^2] 4. **Promise.race** ```javascript // 接口请求超时控制 const fetchWithTimeout = (url, timeout = 5000) => { const fetchPromise = fetch(url); const timeoutPromise = new Promise((_, reject) => setTimeout(() => reject(new Error('请求超时')), timeout) ); return Promise.race([fetchPromise, timeoutPromise]); }; fetchWithTimeout('/api/sensitive-data') .then(data => processData(data)) .catch(error => handleTimeout(error)); // 5秒未响应触发超时 ``` **场景**：支付接口等敏感操作需要严格超时控制 ### #### 三、使用场景决策树 ```mermaid graph TD A[需要所有结果?] -->|是| B{是否允许部分失败?} B -->|不允许| C(Promise.all) B -->|允许| D(Promise.allSettled) A -->|否| E{需要最快结果类型?} E -->|只需第一个成功| F(Promise.any) E -->|无论成功失败| G(Promise.race) ``` ### #### 四、常见误区 1. **误用race做超时控制** ```javascript // 错误示例：未取消实际请求 Promise.race([fetch('data'), timeout(5000)]) .then(...) ``` **正确做法**：应配合AbortController终止请求[^4] 2. **any与race混淆** - `race`响应首个状态变化（可能包含拒绝） - `any`仅关注首个成功结果 3. **allSettled结果处理** 需明确检查status字段： ```javascript results.forEach(item => { if (item.status === 'fulfilled') { processSuccess(item.value); } else { logError(item.reason); } }); ``` ### #### 五、高级组合技巧 ```javascript // 组合使用示例：带优先级的并行请求 async function priorityFetch(primaryAPI, fallbackAPIs) { try { // 优先尝试主API，设置1秒超时 return await Promise.race([ fetch(primaryAPI), new Promise((_, reject) => setTimeout(() => reject('主API超时'), 1000) ) ]); } catch (primaryError) { // 主API失败时触发备用方案 return Promise.any(fallbackAPIs.map(fetch)); } } ``` --- #### 相关问题 1. 如何通过AbortController实现真正的请求超时取消？ 2. 在Node.js环境下如何处理未捕获的Promise异常？ 3. 如何实现Promise的重试机制（如指数退避）？ 4. Promise组合方法在async/await中的最佳实践是什么？