从回调函数到 async/await：JavaScript 异步编程的演进史-js教程-PHP中文网

javascript异步编程演进是为提升可读性与控制流：回调函数易致“回调地狱”，promise用状态和链式调用统一错误处理与并发，async/await则以语法糖实现同步式书写体验，三者叠加演进而非替代。

从回调函数到 async/await：javascript 异步编程的演进史

JavaScript 异步编程的演进，本质是开发者不断对抗“可读性损耗”和“控制流失序”的过程。它不是功能堆砌，而是语言为人类思维让步的结果：从被迫适应异步，到让异步看起来像同步。

回调函数：简单但不可扩展的起点

回调是最原始的异步表达方式，比如 setTimeout、XMLHttpRequest.onload 或 Node.js 的 fs.readFile，都依赖传入一个函数，在操作完成后执行它。

单层回调清晰直接：

fs.readFile('config.json', 'utf8', (err, data) => {
if (err) throw err;
console.log(JSON.parse(data));
});

但一旦需要串行多个依赖操作，缩进就层层加深，错误处理分散，逻辑支离破碎——这就是“回调地狱”。它不难写，但极难改、难测、难调试。

Promise：用状态和链式调用重建秩序

ES6 引入 Promise，核心是把异步操作包装成一个有明确状态（pending / fulfilled / rejected）的对象，并提供统一的 .then() 和 .catch() 接口。

java-enterprise

Java企业开发专家，专注于Spring Boot、微服务架构和JVM优化。适用于：Java语言掌握、

下载

每个 .then() 返回一个新 Promise，天然支持链式调用，扁平化嵌套
错误可集中捕获：.catch() 会捕获链中任意环节抛出的异常或 reject
支持并发控制：Promise.all() 等待全部完成，Promise.race() 响应最快结果

它解决了结构问题，但代码仍需显式书写 .then()，语义上仍是“注册回调”，而非“等待结果”。

async/await：让异步代码回归线性直觉

ES2017 的 async/await 是基于 Promise 的语法糖，目标只有一个：写起来像同步，跑起来仍是异步。

await 只能在 async 函数内使用，它暂停函数执行，直到 Promise settle，然后继续向下
错误可用熟悉的 try/catch 捕获，与同步代码完全一致
顺序逻辑一目了然，调试体验接近同步代码（断点可逐行停）

例如三个串行请求：

async function loadUserProfile(userId) {
  try {
    const user = await fetch(`/api/users/${userId}`).then(r => r.json());
    const profile = await fetch(`/api/profiles/${user.id}`).then(r => r.json());
    const permissions = await fetch(`/api/perm/${profile.role}`).then(r => r.json());
    return { user, profile, permissions };
  } catch (err) {
    console.error('加载失败:', err);
  }
}