【手撕代码系列】JS手写实现Promise.race

news2024/11/23 20:33:02

在这里插入图片描述

公众号:Code程序人生,分享前端所见所闻。

Promise.race() 是一个常见的 JavaScript Promise 方法,它接受一个 Promise 数组作为参数,并返回一个新的 Promise 对象。这个新的 Promise 对象在传入的 Promise 数组中,任意一个 Promise 对象状态变为 fulfilled 或者 rejected,它就会采用这个 Promise 对象的状态作为自己的状态,并返回它的结果或错误原因。
本文将介绍如何手写实现一个简单的 Promise.race() 函数。

实现步骤

  1. 创建一个空的数组 results,它用来保存每个 Promise 对象的结果或错误原因。
  2. 遍历传入的 Promise 数组,对于每个 Promise 对象,添加一个 then() 方法,将它的结果或错误原因保存到 results 数组中,并将其状态设置为 fulfilled
  3. 对于任意一个 Promise 对象的状态变为 fulfilled 或者 rejected,返回一个新的 Promise 对象,并采用这个 Promise 对象的状态作为自己的状态,并返回它的结果或错误原因。

下面是完整的实现代码:

Promise.race = function (promises) {
    return new Promise((resolve, reject) => {
        for (let i = 0; i < promises.length; i++) {
            Promise.resolve(promises[i]).then(resolve).catch(reject)
        }
    })
}

使用示例

我们可以通过以下示例来测试刚才实现的 race() 函数:

const promise1 = new Promise(resolve => setTimeout(() => resolve('foo'), 3000));
const promise2 = new Promise(resolve => setTimeout(() => resolve('bar'), 2000));
const promise3 = new Promise((resolve, reject) => setTimeout(() => reject('baz'), 1000));

promise.race([promise1, promise2, promise3])
  .then(result => console.log(result)) // 输出 "baz"
  .catch(error => console.error(error)); // 输出 "baz"

上面的示例中,我们创建了三个 Promise 对象,它们的状态分别为 pending,并分别在不同的时间内变为了 fulfilled 或者 rejected。然后我们传入这三个 Promise 对象到 race() 函数中,并通过 then()catch() 方法来处理最终的结果或错误原因。由于 promise3 对象的状态最先变为了 rejected,因此最终的输出结果为 "baz"

总结

Promise.race() 是一个非常实用的 Promise 方法,它可以让我们同时运行多个异步操作,并返回最先完成的操作的结果或错误原因。本文通过手写实现的方式,介绍了一个简单的 race() 函数的实现过程,并通过一个示例来演示它的使用。

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

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

相关文章

[架构之路-158]-《软考-系统分析师》-13-系统设计 - 高内聚低耦合详解、图解以及技术手段

目录 第1章 什么是高内聚低耦合 1.1 概念 1.2 目的 1.3 什么时候需要进行高内聚低耦合 1.4 什么系统需要关注高内聚、低耦合 第2章 分类 2.1 内聚的分类 2.2 耦合的分类 第3章 增加高内聚降低耦合度的方法 3.1 增加高内聚 3.2 降低耦合度 第1章 什么是高内聚低耦…

seurat -- 关于DE gene的讨论

实例 # 加载演示数据集 library(Seurat) library(SeuratData) pbmc <- LoadData("pbmc3k", type "pbmc3k.final")# list options for groups to perform differential expression on levels(pbmc)## [1] "Naive CD4 T" "Memory CD4 T…

Orangepi Zero2 全志H616(DHT11温湿度检测)

最近在学习Linux应用和安卓开发过程中&#xff0c;打算把Linux实现的温湿度显示安卓app上&#xff0c;于是在此之前先基于Orangepi Zero2 全志H616下的wiringPi库对DHT11进行开发&#xff0c;本文主要记录开发过程的一些问题和细节&#xff0c;主要简单通过开启线程来接收温湿度…

LeetCode1376. 通知所有员工所需的时间

【LetMeFly】1376.通知所有员工所需的时间 力扣题目链接&#xff1a;https://leetcode.cn/problems/time-needed-to-inform-all-employees/ 公司里有 n 名员工&#xff0c;每个员工的 ID 都是独一无二的&#xff0c;编号从 0 到 n - 1。公司的总负责人通过 headID 进行标识。…

QML动画分组(Grouped Animations)

通常使用的动画比一个属性的动画更加复杂。例如你想同时运行几个动画并把他们连接起来&#xff0c;或者在一个一个的运行&#xff0c;或者在两个动画之间执行一个脚本。动画分组提供了很好的帮助&#xff0c;作为命名建议可以叫做一组动画。有两种方法来分组&#xff1a;平行与…

SNAP + StaMPS 处理Sentinel-1哨兵1 时间序列

SNAP StaMPS 处理Sentinel-1哨兵1 时间序列 Step0: 文件准备及路径设置 0.1 前往GitHub下载snap2stamps: Github snap2stamps 0.2 新建工作路径&#xff0c;用来进行数据处理&#xff0c;并将下载的snap2stamps解压到该文件夹下&#xff0c;并新建两个文件夹&#xff0c;ma…

二叉搜索树的最小绝对差

1题目 给你一个二叉搜索树的根节点 root &#xff0c;返回 树中任意两不同节点值之间的最小差值 。 差值是一个正数&#xff0c;其数值等于两值之差的绝对值。 示例 1&#xff1a; 输入&#xff1a;root [4,2,6,1,3] 输出&#xff1a;1示例 2&#xff1a; 输入&#xff1a;r…

证券从业资格证-考前复习

备考2023年6月证券从业资格证&#xff0c;每章思维导图及相关概念&#xff0c;用于考前复习 1. 金融市场基础知识 1.1 第一章 金融市场体系 #mermaid-svg-XEPZZTVBmo6nGm2Y {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#merm…

【14.HTML-移动端适配】

移动端适配 1 布局视口和视觉视口1.1 设置移动端布局视口宽度 2 移动端适配方案2.1 rem单位动态html的font-size&#xff1b;2.2 vw单位2.3 rem和vw对比2.4 flex的弹性布局 1 布局视口和视觉视口 1.1 设置移动端布局视口宽度 避免布局视口宽度默认980px带了的缩放问题,并且禁止…

周赛343(模拟、网格图求最短路、贪心)

文章目录 周赛343[6341. 保龄球游戏的获胜者](https://leetcode.cn/problems/determine-the-winner-of-a-bowling-game/)模拟 技巧 [2661. 找出叠涂元素](https://leetcode.cn/problems/first-completely-painted-row-or-column/)模拟 [2662. 前往目标的最小代价](https://lee…

给jar包编写start和stop脚本

文章目录 前言一、编写脚本1.start.sh2.stop.sh3.restart.sh 二、展示总结 前言 springboot项目内置tomcat,一般都是以jar包形式对外发布服务,我们不能每次都去kill pid,抽到脚本里来做这个事会方便许多。 一、编写脚本 1.start.sh #!/bin/bash APP_NAME"springboot2.3…

基于深度学习的水果检测与识别系统(Python界面版,YOLOv5实现)

摘要&#xff1a;本博文介绍了一种基于深度学习的水果检测与识别系统&#xff0c;使用YOLOv5算法对常见水果进行检测和识别&#xff0c;实现对图片、视频和实时视频中的水果进行准确识别。博文详细阐述了算法原理&#xff0c;同时提供Python实现代码、训练数据集&#xff0c;以…

QT 中的多线程之 moveToThread

文章目录 1. 概述2. 方法描述3. 代码&#xff1a;4. 运行结果及说明5. 注意事项6. 结语 1. 概述 ​QThread 类提供了一个与平台无关的管理线程的方法。一个 QThread 对象管理一个线程。 QThread 的执行从 run() 函数的执行开始&#xff0c;在 Qt 自带的 QThread 类中&#xf…

GraalVM编译SpringBoot程序

GraalVM 提供了一个名为 “Native Image” 的工具&#xff0c;它能够将 Java 应用程序预编译成本机可执行文件。这种方法的优点是启动速度快&#xff0c;内存占用少&#xff0c;因为程序运行时不需要 JVM 和类加载。 然而这种方式也存在一些弊端&#xff0c;如预编译的 GraalV…

扩展ACL配置

扩展ACL配置 【实验目的】 掌握扩展ACL的配置。认识扩展ACL的作用。验证配置。 【实验拓扑】 实验拓扑如图1所示。 图1 实验拓扑 设备参数如表所示。 表1 设备参数表 设备 接口 IP地址 子网掩码 默认网关 R1 S0/3/0 192.168.1.1 255.255.255.252 N/A Fa0/0/0 …

操作系统:文件系统基础

文件系统基础 ​ 文件是以硬盘为载体的存储在计算机上的信息集合&#xff0c;文件可以是文档、图片、程序等。在系统运行时&#xff0c;计算机以进程为基本单位进行资源的调度和分配&#xff1b;而在用户的输入和输出中&#xff0c;则以文件为基本单位 文件控制块和索引节点 …

【Python基础练习100题--第二篇:文件篇】

前言 这些题都是在B站的练习题&#xff0c;链接在这 对于刚学python的新手来说十分的适合&#xff0c; 可以加强和巩固我们的基础。 嘿嘿 一起噶油吧&#xff01;&#x1f349; &#x1f349;1.对学生成绩排序 # 这里对字典进行排序&#xff0c;同事使用到了sorted函数 # 这…

stm32F103 WIFIESP8266模块连接阿里云平台

(43条消息) ESP8266 AT MQTT 透传指令接入阿里云物联网平台笔记&#xff1b;_安信可科技的博客-CSDN博客 这里这篇博客提到的固件是错误的 我用的固件是这个&#xff0c;刷固件之后&#xff0c;可以连上阿里云。 ATMQTTCLIENTID0,"ClienId"//clientId第二个参数注…