JavaScript异步编程历经回调函数、Promise到Async/Await的演进。Promise通过pending、fulfilled、rejected三种状态解决回调地狱，支持.then()和.catch()链式调用，并提供Promise.all()等方法实现并发控制；Async/Await基于Promise，以同步语法书写异步代码，提升可读性，需配合try/catch处理错误，且await只能在async函数内使用。实际开发中应避免无依赖请求的串行执行，推荐Promise.all()并发处理，并确保关键操作有异常捕获机制。掌握这些技术有助于编写清晰高效的前端异步逻辑。
JavaScript的异步编程是前端开发中的核心概念之一，尤其在处理网络请求、文件操作或定时任务时必不可少。随着语言的发展，从回调函数到Promise，再到Async/Await，异步处理方式不断演进，让代码更清晰、更易维护。
Promise：解决回调地狱的基础工具
早期JavaScript使用回调函数处理异步操作，但多层嵌套容易形成“回调地狱”，代码难以阅读和调试。Promise 的出现解决了这一问题。它代表一个异步操作的最终完成或失败，有三种状态：pending（进行中）、fulfilled（成功）、rejected（失败）。
创建一个Promise示例如下：
const fetchData = new Promise((resolve, reject) => {
setTimeout(() => {
const success = true;
if (success) {
resolve("数据获取成功");
} else {
reject("请求失败");
}
}, 1000);
});
通过 .then() 处理成功结果，.catch() 捕获错误：
立即学习“Java免费学习笔记（深入）”；
fetchData .then(result => console.log(result)) .catch(error => console.error(error));
Promise还提供了 Promise.all()、Promise.race() 等静态方法，用于并行或竞争执行多个异步任务。
Async/Await：更优雅的异步写法
Async/Await 是基于Promise的语法糖，让异步代码看起来像同步代码，极大提升了可读性。函数前加上 async 关键字，表示该函数内部可以使用 await 等待Promise的完成。
改写上面的例子：
async function getData() {
try {
const result = await fetchData;
console.log(result);
} catch (error) {
console.error(error);
}
}
getData();
使用 try...catch 可以优雅地捕获异步错误，避免重复的 .catch 调用。await 只能在 async 函数内部使用，否则会报错。
实际应用中的注意事项
虽然 Async/Await 写法简洁，但在某些场景下仍需注意性能和逻辑结构。
- 连续使用 await 会导致串行执行，若多个请求无依赖关系，应优先使用 Promise.all() 并发执行
- 未加 try/catch 的 await 如果出错会中断函数执行，关键操作务必包裹异常处理
- await 后面最好接 Promise 实例，否则会隐式转换，可能导致意料之外的行为
基本上就这些。掌握 Promise 和 Async/Await，不仅能写出更清晰的异步代码，也能更好理解现代前端框架中的数据加载、状态管理等机制。不复杂，但容易忽略细节。
