首页 > web前端 > js教程 > 正文

JavaScript中的Promise是什么_如何使用它处理异步操作?

紅蓮之龍
发布: 2025-12-15 08:24:07
原创
492人浏览过
Promise 是代表未来完成或失败的异步操作的对象,具有 pending、fulfilled、rejected 三种不可逆状态;通过 new Promise 创建,支持 .then()、.catch()、.finally() 链式调用,并提供 Promise.all() 等静态方法处理并发场景。

javascript中的promise是什么_如何使用它处理异步操作?

Promise 是 JavaScript 中用来更优雅地处理异步操作的对象,它代表一个**尚未完成但未来会完成(或失败)的操作**,避免了传统回调函数嵌套带来的“回调地狱”。

Promise 的三种状态

每个 Promise 实例始终处于以下其中一种状态:

  • pending(等待中):初始状态,既没成功也没失败
  • fulfilled(已成功):操作完成,调用 .then() 获取结果
  • rejected(已失败):操作出错,调用 .catch().then(null, handler) 捕获错误

状态一旦改变(pending → fulfilled 或 pending → rejected),就不可逆,也不会再变。

创建和使用 Promise

new Promise() 构造器创建,接收一个执行器函数(executor),它有两个参数:resolvereject,都是函数:

立即学习Java免费学习笔记(深入)”;

const fetchUser = new Promise((resolve, reject) => {
  setTimeout(() => {
    const success = Math.random() > 0.2;
    if (success) {
      resolve({ id: 1, name: "Alice" }); // 成功时调用 resolve
    } else {
      reject(new Error("Network failed")); // 失败时调用 reject
    }
  }, 1000);
});
登录后复制

之后用链式方法消费结果:

动态WEB网站中的PHP和MySQL:直观的QuickPro指南第2版
动态WEB网站中的PHP和MySQL:直观的QuickPro指南第2版

动态WEB网站中的PHP和MySQL详细反映实际程序的需求,仔细地探讨外部数据的验证(例如信用卡卡号的格式)、用户登录以及如何使用模板建立网页的标准外观。动态WEB网站中的PHP和MySQL的内容不仅仅是这些。书中还提到如何串联JavaScript与PHP让用户操作时更快、更方便。还有正确处理用户输入错误的方法,让网站看起来更专业。另外还引入大量来自PEAR外挂函数库的强大功能,对常用的、强大的包

动态WEB网站中的PHP和MySQL:直观的QuickPro指南第2版 525
查看详情 动态WEB网站中的PHP和MySQL:直观的QuickPro指南第2版
  • .then(result => {...}):处理 fulfilled 状态
  • .catch(error => {...}):统一捕获前面任意环节的 rejected
  • .finally(() => {...}):无论成功失败都会执行(常用于清理,如关闭 loading)

Promise 链式调用与错误传递

每个 .then().catch() 都返回一个新的 Promise,支持链式写法,也支持在中间做数据转换或发起新异步操作:

fetchUser
  .then(user => {
    console.log("用户获取成功:", user);
    return fetch(`/api/posts?userId=${user.id}`); // 返回新 Promise
  })
  .then(response => response.json())
  .then(posts => console.log("文章列表:", posts))
  .catch(err => console.error("出错了:", err.message))
  .finally(() => console.log("请求流程结束"));
登录后复制

注意:如果某个 .then() 中抛出错误,或返回一个被 reject 的 Promise,控制权会直接跳转到下一个最近的 .catch()

常用静态方法

Promise 构造器还提供几个实用的静态方法:

  • Promise.resolve(value):快速创建一个立即 fulfilled 的 Promise
  • Promise.reject(error):快速创建一个立即 rejected 的 Promise
  • Promise.all([p1, p2, ...]):全部成功才 fulfilled,任意一个 rejected 就整体 rejected
  • Promise.race([p1, p2, ...]):谁先 settle(fulfill 或 reject),就以它的结果为准
  • Promise.allSettled([p1, p2, ...]):等所有 Promise 都 settle 后返回每个结果的状态数组(ES2020+)

例如用 Promise.all 并发加载多个资源:

Promise.all([
  fetch('/api/user'),
  fetch('/api/profile'),
  fetch('/api/settings')
])
.then(([userRes, profileRes, settingsRes]) => {
  return Promise.all([
    userRes.json(),
    profileRes.json(),
    settingsRes.json()
  ]);
})
.then(([user, profile, settings]) => {
  console.log({ user, profile, settings });
});
登录后复制

基本上就这些。Promise 不复杂但容易忽略状态不可逆、链式返回新 Promise 这些关键点。掌握它,是写可维护异步代码的基础。

以上就是JavaScript中的Promise是什么_如何使用它处理异步操作?的详细内容,更多请关注php中文网其它相关文章!

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号