​

核心概念

Promise 是处理异步操作的标准化对象，将回调地狱转换为链式调用，提供更优雅的异步编程解决方案。其本质是一个状态机，具有三种确定状态：

核心方法解析

1. 实例方法

// 基础链式调用
fetchData()
  .then(handleSuccess)   // 成功处理
  .catch(handleError)    // 错误捕获
  .finally(cleanup);     // 最终执行（ES2018）

// 高级用法
fetchData()
  .then(
    result => processData(result),  // 成功回调
    error => recover(error)         // 专属错误处理（不常用）
  )

2. 静态方法

// 并发控制
Promise.all([req1, req2])        // 全部成功，任一失败则终止
  .then(([res1, res2]) => ...)

Promise.allSettled([req1, req2]) // 获取所有结果（无论成败）
  .then(results => 
    results.filter(r => r.status === 'fulfilled')
  )

Promise.race([req1, req2])       // 首个完成（无论成败）
  .then(firstResult => ...)

// 快捷方法
Promise.resolve(42)              // 创建成功Promise
Promise.reject(new Error())      // 创建失败Promise

关键特性与优化实践

1. 不可逆状态转移一旦状态变化不可回退，确保操作确定性
2. 微任务优先级Promise 回调属于微任务（microtask），执行优先级高于宏任务（macrotask）：setTimeout(() => console.log('宏任务'), 0); Promise.resolve().then(() => console.log('微任务')); // 输出顺序：微任务 → 宏任务
3. 错误冒泡机制错误会穿透直到被捕获：fetchData() .then(step1) // 可能出错 .then(step2) // 可能出错 .catch(err => console.error(err)); // 统一捕获
4. 内存泄漏防范// 反例：未处理的Promise function leakyCall() { fetchData().then(data => ...); } // 正例：确保错误处理 function safeCall() { fetchData() .then(...) .catch(err => logger.error(err)); }
5. 取消模式实现// 使用AbortController（现代浏览器） const controller = new AbortController(); fetch(url, { signal: controller.signal }) .then(...) .catch(err => { if (err.name === 'AbortError') console.log('已取消'); }); // 取消操作 controller.abort();

高级应用场景

1. 异步流程控制// 顺序执行异步任务 const tasks = [task1, task2, task3]; tasks.reduce((chain, task) => chain.then(task), Promise.resolve() );
2. 超时控制function withTimeout(promise, timeout) { return Promise.race([ promise, new Promise((_, reject) => setTimeout(() => reject(new Error('Timeout')), timeout) ) ]); }
3. 缓存异步结果const cache = new Map(); function cachedFetch(url) { if (cache.has(url)) return cache.get(url); const promise = fetch(url).then(res => res.json()); cache.set(url, promise); return promise; }

性能优化建议

1. 避免嵌套Promise// 反例：回调地狱变体 fetchUser().then(user => { fetchProfile(user.id).then(profile => ...); }); // 正例：链式展开 fetchUser() .then(user => fetchProfile(user.id)) .then(profile => ...);
2. 批量并发请求// 反例：顺序请求 const results = []; for (const id of ids) { results.push(await fetchItem(id)); // 阻塞执行 } // 正例：并发请求 const promises = ids.map(id => fetchItem(id)); const results = await Promise.all(promises);
3. 合理使用async/await// 优化前 function process() { fetchData() .then(data => transform(data)) .then(result => save(result)); } // 优化后（语义更清晰） async function process() { const data = await fetchData(); const result = transform(data); await save(result); }

Promise vs 其他方案对比

Promise结合 async/await 可构建高可维护性异步代码。掌握其原理和优化技巧，可显著提升应用性能和开发效率。​