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

JavaScript 中的 Promise

Barbara Streisand
发布: 2024-10-20 14:34:02
原创
496 人浏览过

承诺

代表一个值,可能现在可用,或将来可用,或永远不可用。
Promise 生命周期:

  • 待处理:功能开始运行。

  • 已完成:操作成功完成,我们有一个结果值。

  • 已拒绝:操作失败,我们有一个错误对象。

Promise 的语法:

使用新的 Promise 构造函数创建 Promise,该构造函数采用带有两个参数的函数:resolve 和reject。

Promise in Javascript
在代码片段中,我们有一个名为 getUser 的函数,它返回一个新的 Promise(一个具有处理异步操作方法的 Promise 对象)。

在 Promise 构造函数中,我们有一个 setTimeout 函数,用于模拟异步操作,例如从数据库中获取数据。 Promise 有两个关键方法传递给它:

  • resolve:操作成功时调用。在本例中,如果 id === 1,则返回一个模拟用户对象 { id: 1, name: "Diana", email: "Diana@test.com" }.

  • reject:操作失败时调用。如果 id 不为 1,则 Promise 将被拒绝,并显示错误消息“找不到用户...”。

resolve 和reject 函数的作用类似于promise 上下文中的return 语句,允许调用者处理操作的成功或失败。

链接承诺

Promise 可以链接起来,允许您按顺序执行一系列异步操作:

Promise in Javascript

在此示例中,我们链接多个 Promise 来模拟逐步获取数据。

  • 首先,我们调用 getUser(1) 来获取用户数据。如果有效,我们将进入下一步。

  • 其次,我们获取 user.id 并通过调用 getOrders(user.id) 使用它来获取该用户的订单。

-第三,我们从列表中选择第二个订单 (orders[1]) 并使用 getOrderDetails(orders[1]) 获取其详细信息。

如果任何时候出现任何问题(例如找不到用户或订单丢失),错误将在 .catch() 块中捕获并显示。

简单细分:

  • 您请求一个用户。
  • 如果您找到用户,则可以询问他们的订单。
  • 如果您收到订单,请询问其中一份订单的详细信息。
  • 如果出现任何问题(例如未找到用户或订单), - 它将显示错误。

结果:

Promise in Javascript

这种方法可以更轻松地以干净、逐步的方式处理异步任务,而不是使用混乱的代码。

承诺方法:

Promise.all():并行执行多个 Promise 并等待所有承诺都得到解决。

Promise.all([promise1, promise2])
  .then((results) => {
    console.log(results);  // Array of all fulfilled values
  });

登录后复制

示例:

Promise in Javascript

(我建议阅读此方法并将其与回调进行比较)

以上是JavaScript 中的 Promise的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:dev.to
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板