JavaScript:Promise 组合器

news2024/10/1 19:21:20

如果可以实现记得点赞分享,谢谢老铁~

在这里插入图片描述

Promise在 JavaScript 中并不是一个新概念。它们是表示异步操作的最终完成或失败及其结果值的对象。

Promise 有三种可能的状态:pending – 初始状态(仍在等待)、已完成– Promise 成功、Rejected – Promise 失败。如果承诺被履行或被拒绝,但没有悬而未决,则该承诺被称为已解决

Promise 组合器用于更轻松地处理 Promise。JavaScript 有四个 Promise 组合器,但它们处于 ECMAScript 的不同阶段。

Promise.all()

Promise.all() 是一种接受可迭代的 Promise 对象并返回单个 Promise 的方法。如果所有的承诺都得到履行,则返回的承诺也得到履行。

const P1 = Promise.resolve(18);
const P2 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve(5);
  }, 100);
});
const P3 = Promise.resolve("18.5.");
const promises = [P1, P2, P3];

Promise.all(promises).then((values) => {
  console.log(values);
});
//Array [18, 5, "18.5."]

或者,使用异步/等待:

async function f() {
  const P1 = Promise.resolve(18);
  const P2 = new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(5);
    }, 100);
  });
  const P3 = Promise.resolve("18.5.");
  const promises = [P1, P2, P3];
  try {
    const result = await Promise.all(promises);
    console.log(result);
  } catch (err) {
    console.log(err);
  }
}
f(); //Array [18, 5, "18.5."]

即使第二个 Promise 花费了最长的时间来解决,返回的 Promise 中的顺序将始终与其源 Promise 中的顺序保持不变。

如果传递一个空对象,那么它返回一个已经解析的 Promise。

Promise.all() 也接受非 Promise 值并按原样返回它们。

async function f() {
  const promises = [1, 2, 3];
  try {
    const result = await Promise.all(promises);
    console.log(result);
  } catch (err) {
    console.log(err);
  }
}
f(); //Array [1, 2, 3]

如果至少有一个 Promise 被拒绝,则返回的 Promise 被拒绝。该错误成为整个 Promise.all() 方法的结果。其他承诺的结果被完全忽略。

async function f() {
  const P1 = Promise.resolve(18);
  const P2 = Promise.resolve(5);
  const P3 = new Promise((resolve, reject) => {
    setTimeout(() => {
      reject(new Error("Error happened!"));
    }, 200);
  });
  const promises = [P1, P2, P3];
  try {
    const result = await Promise.all(promises);
    console.log(result);
  } catch (err) {
    console.log(err);
  }
}
f(); //Error: Error happened!

自 ES2015 中引入 Promise 以来,Promise.all() 就成为了 JavaScript 的一部分,同时还添加了一种 Promise 静态方法:Promise.race()

Promise.race()

Promise.race() 从收到的可迭代 Promise 对象中返回第一个已解决的 Promise。那就可以兑现诺言了。

async function f() {
  const P1 = Promise.resolve(18);
  const P2 = Promise.resolve(5);
  const P3 = new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("18.5.");
    }, 100);
  });
  const promises = [P1, P2, P3];
  try {
    const result = await Promise.race(promises);
    console.log(result);
  } catch (err) {
    console.log(err);
  }
}
f(); //18

或者它可能是一个被拒绝的 Promise。

async function f() {
  const P1 = Promise.reject(new Error("Error happened!"));
  const P2 = Promise.resolve(5);
  const P3 = new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("18.5.");
    }, 100);
  });
  const promises = [P1, P2, P3];
  try {
    const result = await Promise.race(promises);
    console.log(result);
  } catch (err) {
    console.log(err);
  }
}
f(); //Error: Error happened!

如果传递一个空对象,则返回的 Promise 将永远挂起。

如果 Promise.race() 接收到非 Promise 值,它将解析为可迭代中找到的第一个值。

async function f() {
  const promises = [1, 2, 3];
  try {
    const result = await Promise.race(promises);
    console.log(result);
  } catch (err) {
    console.log(err);
  }
}
f(); //1

Promise.allSettled()

最后的ES2020中添加了 Promise.allSettled() 方法。旧的浏览器可能仍然需要腻子来支持它。此方法等待所有收到的承诺结算。它返回一个 Promise:

  • { status: “fulfilled”, value: result } 表示成功响应或
  • { status: “rejected”, Reason: error} 对于有错误的响应。
async function f() {
  const P1 = Promise.reject(new Error("Error happened!"));
  const P2 = 5;
  const P3 = new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("18.5.");
    }, 100);
  });
  const promises = [P1, P2, P3];
  try {
    const result = await Promise.allSettled(promises);
    console.log(result);
  } catch (err) {
    console.log(err);
  }
}
f(); //Array [
//Object { status: "rejected", reason: Error: Error happened! },
//Object { status: "fulfilled", value: 5 },
//Object { status: "fulfilled", value: "18.5." }]

正如我们在上面的示例中看到的,方法也可以接收非承诺值。

如果传递一个空的可迭代对象,Promise.allSettled() 将返回一个已解析的 Promise 对象作为空数组。

async function f() {
  try {
    const result = await Promise.allSettled([]);
    console.log(result);
  } catch (err) {
    console.log(err);
  }
}
f(); //Array []

Promise.any()

Promise.any() 是最新的 Promise 组合器,目前处于TC39 流程的第 3 阶段。它需要一个可迭代对象,一旦其中一个 Promise 得到满足,就会返回该 Promise。

async function f() {
  const P1 = Promise.resolve(18);
  const P2 = Promise.resolve(5);
  const P3 = new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("18.5.");
    }, 100);
  });
  const promises = [P1, P2, P3];
  try {
    const result = await Promise.any(promises);
    console.log(result);
  } catch (err) {
    console.log(err);
  }
}
f(); //18

此方法与 Promise.all() 之间的区别在于 Promise.all() 返回履行值数组,而 Promise.any() 仅返回第一个履行值。Promise.race() 与 Promise.any() 不同,因为 Promise.race() 返回第一个固定值(已实现或已拒绝),而 Promise.any() 会忽略被拒绝的 Promise,直到第一个 Promise 已实现。

async function f() {
  const P1 = Promise.reject(new Error("Error happened!"));
  const P2 = Promise.resolve(5);
  const P3 = new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("18.5.");
    }, 100);
  });
  const promises = [P1, P2, P3];
  try {
    const result = await Promise.any(promises);
    console.log(result);
  } catch (err) {
    console.log(err);
  }
}
f(); //5

如果传递了一个空的可迭代对象,该方法将返回一个已经解决的承诺。

如果所有给定的 Promise 都被拒绝,该方法会异步拒绝 AggregateError ,这是一个新的 Error 子类,它将各个错误组合在一起。

Promise.any() 仍处于实验阶段,浏览器尚未完全支持。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/788370.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

[NLP]使用Alpaca-Lora基于llama模型进行微调教程

Stanford Alpaca 是在 LLaMA 整个模型上微调,即对预训练模型中的所有参数都进行微调(full fine-tuning)。但该方法对于硬件成本要求仍然偏高且训练低效。 [NLP]理解大型语言模型高效微调(PEFT) 因此, Alpaca-Lora 则是利用 Lora…

Qt6 Qt Quick UI原型学习QML第七篇

文章目录 效果演示QML语法 ClickableImageV2.qmlQML语法 EasingCurves.qml时钟小球滚动QML 源码## 时钟小球滚动QML解释 语法解释参考动画片动画元素应用动画可点击图像V2上升的物体第一个对象第二个对象第三个对象缓和曲线分组动画并行动画连续动画嵌套动画 效果演示 QML语法 …

给APK签名—两种方式(flutter android 安装包)

前提:给未签名的apk签名,可以先检查下apk有没有签名 通过命令行查看:打开终端或命令行界面,导入包含APK文件的目录,并执行以下命令: keytool -printcert -jarfile your_app.apk 将 your_app.apk替换为要检查…

MybatisPlus查询条件为空字符串或null问题及解决

参考:https://www.yii666.com/blog/292928.html 解决办法 mybatisplus的条件构造器方法 eq()、like()等这些方法能支持第三个参数 condition condition是一个布尔值,当condition为false 时,当前这个条件方法不会生效,即生成的s…

曲线拟合曲面拟合(MATLAB拟合工具箱)位置前馈量计算(压力闭环控制应用)

利用PLC进行压力闭环控制的项目背景介绍请查看下面文章链接,这里不再赘述。 信捷PLC压力闭环控制应用(C语言完整PD、PID源代码)_RXXW_Dor的博客-CSDN博客闭环控制的系列文章,可以查看PID专栏的的系列文章,链接如下:张力控制之速度闭环(速度前馈量计算)_RXXW_Dor的博客-CSD…

flash attention 2论文学习

flash attention作者Tri Dao发布了flash attention 2,性能为flash attention的2倍。 优化点主要如下: 一、减少 non-matmul FLOPs A00中由于tensor core的存在,使得gpu对于浮点矩阵运算吞吐很高,如FP16/BF16可以达到312 TFLOPs/…

【弹力设计篇】聊聊熔断设计

为什么需要熔断 熔断这个词一听从生活中就是保险丝超过一定的温度后自动断开,以此来保护家用电器,属于电路中自我保护装置。如果没有熔断,那么家用电器一定会损坏的。 进一步再来分析一下,在分布式系统中,各个系统之间…

建立TCP连接的各个系统调用

TCP 连接的过程图 服务器 socket() 函数 socket() 返回的 sockfd 是一个描述符。socket()对应于普通文件的打开操作。普通文件的打开操作返回一个文件描述字,而socket()用于创建一个socket描述符(socket descriptor),它唯一标识…

PX4仿真jMAVSim没有界面

切换java版本,使用java-8 sudo update-alternatives --config java删除旧文件 rm -rf Tools/jMAVSim/out编辑accessibility.properties 文件: sudo gedit /etc/java-8-openjdk/accessibility.properties注释掉下面这行 #assistive_technologiesorg.GNOME.Acessi…

笔试题:统计字符串中某字符串在其出现的字符个数

笔试题:统计字符串中某一子串的字符个数:例如字符串aabbcd,有aabb:4,ab:2 哈哈,这道题是小编面试音视频龙头企业的笔试题,以下是我写的代码:如果有错误,希望可以指正!!! 解题思路:利用双指针i和…

一刷总结篇

也养成了记录博客的好习惯吧,不过一刷有时也偷懒没跟上,但总体而言是比没刷代码随想录之前的状态要好。还是要记得当前目标是什么(深抓主要矛盾)。二刷代码随想录时每题要充分思考并且刷之前放过的题(如扩展提等&#…

单相导轨电表支持双路双控吗?

单相导轨电表是一种电子式电能表,它采用导轨式安装结构,体积小、安装方便,适用于城市、农村或工厂企业的单相电能计量和集中式安装。单相导轨电表可以支持双路双控,也就是可以同时测量两个电路的电能消耗并进行控制。 双路双控是指…

图形编辑器开发:是否要像 Figma 一样上 wasm

大家好,我是前端西瓜哥。 wasm 拿来做 Web 端的图形编辑器貌似是不错的选择。 因为图形处理会有相当多无法利用到 WebGL GPU 加速的 CPU 密集的计算。比如对一条复杂贝塞尔曲线进行三角化,对多个图形进行复杂图形的布尔运算。 图形编辑器性能天花板 F…

TypeChat,用TypeScript快速接入AI大语言模型

TypeChat是C# 和 TypeScript 之父 Anders Hejlsberg全新的开源项目。使用AI在自然语言和应用程序和API之间建立桥梁,并且使用TypeScript。 现在出现了很多大型语言模型,但是如何将这些模型最好地集成到现有的应用程序中,如何使用人工智能来接…

设计模式||工厂模式(含有代码样例)

什么是工厂模式? 工厂模式(Factory Pattern)是一种常见的创建型设计模式,它提供了一种封装对象创建过程的方式。工厂模式通过定义一个创建对象的接口,但具体的对象创建在子类中实现,这样可以将对象的实例化…

Docker系列 1 - 镜像和容器

Docker系列 1 - 镜像和容器 1、关于 Docker2、镜像 image3、容器 container 1、关于 Docker docker官网:http://www.docker.com docker中文网站:https://www.docker-cn.com/ Docker Hub 仓库官网: https://hub.docker.com/ Docker 的基本组成&#…

【C++】多态原理剖析,Visual Studio开发人员工具使用查看类结构cl /d1 reportSingleClassLayout

author:&Carlton tag:C topic:【C】多态原理剖析,Visual Studio开发人员工具使用查看类结构cl /d1 reportSingleClassLayout website:黑马程序员C tool:Visual Studio 2019 date:2023年7月24日 目…

电脑记事本在哪里?电脑桌面显示记事本要怎么设置?

绝大多数上班族在使用电脑办公时,都需要随手记录一些琐碎或重要的事情,例如工作注意事项、常用的文案、某项工作的具体要求、多个平台的账号和密码等。于是就有不少小伙伴想要使用电脑记事本软件来记录,那么电脑记事本在哪里呢?想…

VM虚拟机网络配置桥接模式方法步骤

VM虚拟机配置桥接模式,可以让虚拟机和物理主机一样存在于局域网中,可以和主机相通,和互联网相通,和局域网中其它主机相通。 vmware为我们提供了三种网络工作模式,它们分别是:Bridged(桥接模式&…

C# | [极坐标] 与 [平面直角系坐标] 的相互转换

极坐标与平面直角系坐标的相互转换方法及C#代码实现 文章目录 极坐标与平面直角系坐标的相互转换方法及C#代码实现前言极坐标转换为平面直角系坐标计算公式示例代码运行结果 平面直角系坐标转换为极坐标计算公式示例代码运行结果 结束语 前言 极坐标和平面直角系坐标是常见的坐…