在当今的前端与 Node.js 开发中，异步编程早已成为日常。无论是从服务器获取数据、读写文件，还是处理用户交互，开发者几乎每天都在面对那些只返回 Promise 的函数。然而，许多初学者甚至部分有经验的开发者，仍然对 Promise 的使用感到困惑：当函数只返回一个 Promise 时，我究竟该怎么正确调用它？

本文将以此问题为切入点，为开发者梳理 Promise 的三种主流使用模式，并揭示一些常见的坑与最佳实践。

一、Promise 是什么？为什么函数只返回它？

Promise（承诺）是 JavaScript 中用于处理异步操作的对象，代表一个未来可能完成或失败的值。ES6 引入 Promise 后，它迅速取代了旧式的回调函数，成为异步编程的基石。

当一个函数“只返回一个 Promise”时，意味着该函数不会立即返回结果，而是返回一个“占位符”。调用者需要等待这个占位符“兑现”（resolve）或“拒绝”（reject），才能拿到最终数据或错误信息。

例如下面的 fetchUserData 函数：

function fetchUserData(userId) {
  return fetch(`https://api.example.com/users/${userId}`)
    .then(response => response.json());
}

它只返回一个 Promise，调用者无法直接得到用户数据，必须通过特定方式获取。

二、三种正确使用方式

1. 使用 .then() 链式调用

最经典的方式是直接对返回的 Promise 调用 .then() 和 .catch()：

fetchUserData(42)
  .then(user => console.log(user.name))
  .catch(error => console.error('获取用户失败:', error));

这种方式适合简单的单步操作，但一旦嵌套多层，代码容易变得难以维护——这就是著名的“回调地狱”的 Promise 版本。

2. 使用 async/await（推荐）

ES2017 引入的 async/await 是目前最优雅、最易读的写法。只需在函数前加 async，即可在函数内部使用 await 等待 Promise 完成：

async function displayUserName(userId) {
  try {
    const user = await fetchUserData(userId);
    console.log(user.name);
  } catch (error) {
    console.error('获取用户失败:', error);
  }
}

需要注意的是：await 只能在 async 函数内部使用。如果在全局作用域或普通函数中使用 await，会触发语法错误。这一点常被新手忽视。

3. 使用 Promise.all 等组合方法

当需要同时处理多个 Promise 时，例如并发请求多个用户数据，可以使用 Promise.all、Promise.allSettled 等方法：

async function fetchMultipleUsers(ids) {
  try {
    const users = await Promise.all(ids.map(id => fetchUserData(id)));
    console.log(users);
  } catch (error) {
    console.error('至少一个请求失败:', error);
  }
}

Promise.all 会在所有 Promise 都完成时返回结果数组，一旦任一失败则立即拒绝。而 Promise.allSettled 则等待所有请求结束，无论成败。

三、常见陷阱与应对

陷阱一：忘记处理拒绝（rejection）

忽略 .catch() 或 try/catch 可能导致未捕获的错误，甚至导致进程崩溃（尤其在 Node.js 环境中）。任何 Promise 都必须有拒绝处理。

// 危险写法
fetchUserData(42).then(user => console.log(user.name));

// 正确写法
fetchUserData(42).then(console.log).catch(console.error);

陷阱二：在非 async 函数中使用 await

许多开发者会在普通函数（如 forEach 回调）内直接写 await，导致语法错误或逻辑错乱。

// ❌ 错误
users.forEach(id => {
  const user = await fetchUserData(id); // 报错
});

// ✅ 正确
for (const id of users) {
  const user = await fetchUserData(id);
}

陷阱三：误认为 Promise 是同步的

Promise 的 .then() 和 await 都不会阻塞主线程，而是将回调推入微任务队列。因此，以下代码的输出顺序可能出乎意料：

console.log('1');
Promise.resolve().then(() => console.log('2'));
console.log('3');
// 输出：1, 3, 2

理解事件循环是掌握 Promise 的关键。

四、最佳实践总结

  1. 首选 async/await，除非需要链式处理复杂变换。
  2. 始终添加错误处理，无论是 .catch() 还是 try/catch。
  3. 用 Promise.all 处理并发，用 for...of + await 处理串行。
  4. 避免在 forEach / map 中直接 await，它们不会等待 Promise 完成，应改用 Promise.all 或 for...of。
  5. 善用调试工具：Chrome DevTools 的 Sources 面板可以设置断点并查看 Promise 状态。

五、未来展望

随着 JavaScript 持续进化，新特性如 Top-level await（已在 ES2022 中标准化）允许在模块顶层直接使用 await，进一步简化了脚本编写。而诸如 Promise.withResolvers 等提案也在路上，让 Promise 的创建与使用更加灵活。

归根结底，只返回 Promise 的函数并不复杂。掌握以上三种模式，避开几个常见陷阱，每一位开发者都能在异步编程的浪潮中从容前行。

作者简介：本文由资深前端技术编辑撰写，专注于 JavaScript 异步编程与工程实践。若有疑问，欢迎在评论区留言讨论。