当前位置: 首页 > news >正文

手动实现promise的all,race,finally方法

Promise.all

是一个非常有用的工具,它接受一个 Promise 对象数组,并返回一个新的 Promise。当所有输入的 Promise 都成功解决时,新的 Promise 会解决为一个包含所有结果的数组;如果任何一个 Promise 被拒绝,新的 Promise 会立即被拒绝,并返回第一个被拒绝的错误。

 function myPromiseAll(promiseArray) {return new Promise((resolve, reject) => {//1.参数检查://检查传入的参数是否为数组,如果不是数组,则抛出 TypeError。if (!Array.isArray(promiseArray)) {return reject(new TypeError("arguments must be an array"))}//2.初始化://创建一个 results 数组来存储每个 Promise 的结果。//初始化 count 计数器,用于记录已经完成的 Promise 数量。//获取 promises 数组的总长度 len。let result = []let count = 0const len = promiseArray.length//3.特殊情况处理://如果 promises 数组为空,直接返回一个已解决的 Promise,其结果为一个空数组。if (len === 0) {resolve(result)}//4.遍历 Promise 数组://使用 for循环 遍历 promises 数组。//对每个 Promise 使用 Promise.resolve 确保它是 Promise 对象。//使用 then 方法处理每个 Promise 的成功和失败情况://成功时,将结果存储在 results 数组中,并增加 count。//如果 count 达到 len,说明所有 Promise 都已成功解决,调用 resolve 方法,传递 results 数组。//失败时,立即调用 reject 方法,传递错误信息。for (let i = 0; i < len; i++) {Promise.resolve(promiseArray[i]).then((res) => {result[i] = rescount++if (count === len) {resolve(result)}}).catch((err) => reject(err))}})}// 示例代码const promise1 = Promise.resolve(1);const promise2 = Promise.resolve(2);const promise3 = new Promise((resolve) => setTimeout(() => resolve(3), 1000));const promise4 = Promise.reject('Error');myPromiseAll([promise1, promise2, promise3]).then((results) => {console.log('All promises resolved:', results); // 输出: All promises resolved: [1, 2, 3]}).catch((error) => {console.error('An error occurred:', error);});myPromiseAll([promise1, promise2, promise4]).then((results) => {console.log('All promises resolved:', results);}).catch((error) => {console.error('An error occurred:', error); // 输出: An error occurred: Error});

Promise.race

接受一个 Promise 对象数组,并返回一个新的 Promise。新的 Promise 会在第一个输入的 Promise 被解决或拒绝时立即解决或拒绝,其结果或错误信息取决于第一个完成的 Promise。

 function myPromiseRace(promiseArray) {return new Promise((resolve, reject) => {//1.参数检查://检查传入的参数是否为数组,如果不是数组,则抛出 TypeError。if (!Array.isArray(promiseArray)) {return reject(new TypeError("arguments must be an array"))}//2.遍历 Promise 数组://使用 for 循环遍历 promises 数组。//对每个 Promise 使用 Promise.resolve 确保它是 Promise 对象。//使用 then 方法处理每个 Promise 的成功和失败情况://成功时,立即调用 resolve 方法,传递结果值。//失败时,立即调用 reject 方法,传递错误信息。for (let i = 0; i < promiseArray.length; i++) {//写法一:Promise.resolve(promiseArray[i]).then((res) => {resolve(res)},(error) => {reject(error)})//写法二://Promise.resolve(promiseArray[i]).then(resolve, reject)}})}// 示例代码const promise1 = Promise.resolve(1);const promise2 = new Promise((resolve) => setTimeout(() => resolve(2), 1000));const promise3 = new Promise((resolve) => setTimeout(() => resolve(3), 500));const promise4 = Promise.reject('Error');myPromiseRace([promise1, promise2, promise3]).then((result) => {console.log('First resolved promise:', result); // 输出: First resolved promise: 1}).catch((error) => {console.error('An error occurred:', error);});myPromiseRace([promise2, promise3, promise4]).then((result) => {console.log('First resolved promise:', result);}).catch((error) => {console.error('An error occurred:', error); // 输出: An error occurred: Error});

Promise.finally

用于指定不管 Promise 最终状态如何,都会执行的操作。这个方法通常用于清理工作,比如关闭文件句柄、清除定时器等。

正常使用:

promise.then((result) => {// 处理已解决的情况}).catch((error) => {// 处理已失败的情况}).finally(() => {// 不管Promise对象最终的状态如何,都会执行的回调函数});

手动实现:

function myPromiseFinally(promise, callback) {return promise.then(//接受两个参数:一个 Promise 对象 promise 和一个回调函数 callback。//使用 then 方法分别处理 promise 的成功和失败情况。//在成功的情况下,先调用 callback 回调函数,然后返回原始的成功值。//在失败的情况下,先调用 callback 回调函数,然后重新抛出原始的错误。(value) => Promise.resolve(callback()).then(() => value),(error) =>Promise.resolve(callback()).then(() => {throw error}))}//示例代码: 
const promise1 = Promise.resolve(1);
const promise2 = new Promise((resolve) => setTimeout(() => resolve(2), 1000));
const promise3 = new Promise((resolve, reject) => setTimeout(() => reject('Error'), 500));// 成功的情况
myPromiseFinally(promise1, () => {console.log('Finally block executed');
}).then((result) => {console.log('Result:', result); // 输出: Result: 1
}).catch((error) => {console.error('Error:', error);
});// 延迟成功的情况
myPromiseFinally(promise2, () => {console.log('Finally block executed');
}).then((result) => {console.log('Result:', result); // 输出: Result: 2
}).catch((error) => {console.error('Error:', error);
});// 失败的情况
myPromiseFinally(promise3, () => {console.log('Finally block executed');
}).then((result) => {console.log('Result:', result);
}).catch((error) => {console.error('Error:', error); // 输出: Error: Error
});

相关文章:

手动实现promise的all,race,finally方法

Promise.all 是一个非常有用的工具&#xff0c;它接受一个 Promise 对象数组&#xff0c;并返回一个新的 Promise。当所有输入的 Promise 都成功解决时&#xff0c;新的 Promise 会解决为一个包含所有结果的数组&#xff1b;如果任何一个 Promise 被拒绝&#xff0c;新的 Prom…...

H5移动端预览PDF方法

新建页面 新建一个页面以便去预览对应的pdf 新建完后在 pages.json 文件内去新增对应路由 页面内容 <template><view class"page"><view class"pdf"><view id"demo"></view></view><view class"b…...

uniapp—android原生插件开发(1环境准备)

本篇文章从实战角度出发&#xff0c;将UniApp集成新大陆PDA设备RFID的全过程分为四部曲&#xff0c;涵盖环境搭建、插件开发、AAR打包、项目引入和功能调试。通过这份教程&#xff0c;轻松应对安卓原生插件开发与打包需求&#xff01; 项目背景&#xff1a; UniApp集成新大陆P…...

《潜行者2切尔诺贝利之心》游戏引擎介绍

潜行者2切尔诺贝利之心是基于虚幻5引擎&#xff0c;所以画面效果大家不必担心。游戏目前已经跳票了很久&#xff0c;预计发售时间是2024 年 11 月 21 日&#xff0c;这次应该不会再跳票。 潜行者2切尔诺贝利之心是虚幻5吗 答&#xff1a;是虚幻5。 潜行者官方推特之前回复了…...

winform 加载 office excel 插入QRCode图片如何设定位置

需求&#xff1a;winform 加载 office excel 并加载QRCode图片&#xff0c;但是每台PC打印出来QRCode位置都不太一样&#xff0c;怎么办呢&#xff1f; 我的办法&#xff1a; 1、在sheet中插入一个 textbox &#xff0c;改名 qrcode &#xff08;这个名字随便设置&#xff09…...

简易入手《SOM神经网络》的本质与原理

原创文章&#xff0c;转载请说明来自《老饼讲解神经网络》:www.bbbdata.com 关于《老饼讲解神经网络》&#xff1a; 本网结构化讲解神经网络的知识&#xff0c;原理和代码。 重现matlab神经网络工具箱的算法&#xff0c;是学习神经网络的好助手。 目录 一、入门原理解说 01.…...

21.assert断言

assert&#xff08;断言&#xff09;主要用于在程序运行过程中检查某个条件是否满足&#xff0c;如果不满足则会触发错误并终止程序执行&#xff0c;可以帮助程序员在开发阶段及时发现可能存在的逻辑错误等问题。 通过断言调试程序&#xff0c;abotr() has been called 就是断言…...

15分钟学 Go 第 46 天 : 监控与日志

第46天&#xff1a;监控与日志 学习目标 了解如何实现应用监控与日志管理&#xff0c;掌握相关工具和最佳实践。 内容结构 引言监控的概念与工具 监控的定义常见监控工具 日志管理的概念与工具 日志的重要性常见日志管理工具 实现监控与日志的最佳实践 监控指标日志格式 实战…...

BFS 算法专题(四):多源 BFS

目录 1. 01 矩阵 1.1 算法原理 1.2 算法代码 2. 飞地的数量 2.1 算法原理 2.2 算法代码 3. 地图中的最高点 3.1 算法原理 3.2 算法代码 4. 地图分析 4.1 算法原理 4.2 算法代码 1. 01 矩阵 . - 力扣&#xff08;LeetCode&#xff09; 1.1 算法原理 采用 BFS 正难…...

基于Spring Boot+Vue的养老院管理系统【原创】

一.系统开发工具与环境搭建 1.系统设计开发工具 后端使用Java编程语言的Spring boot框架 项目架构&#xff1a;B/S架构 运行环境&#xff1a;win10/win11、jdk17 前端&#xff1a; 技术&#xff1a;框架Vue.js&#xff1b;UI库&#xff1a;ElementUI&#xff1b; 开发工具&…...

Linux screen和cscope工具使用总结

1 minicom使用 1.1 minicom配置 第一次启动时&#xff1a; 如果输入sudo minicom提示错误&#xff0c;则需&#xff1a; sudo minicom -s 启动 出现配置菜单&#xff1a;选serial port setup 进入串口配置 输入A配置串口驱动为/dev/ttyUSB0 输入E配置速率为115200 8N1 输入F将 …...

深度学习面试八股汇总

按序发布&#xff1a; 深度学习——优化算法、激活函数、归一化、正则化 进入 深度学习——权重初始化、评估指标、梯度消失和梯度爆炸 进入 深度学习——前向传播与反向传播、神经网络&#xff08;前馈神经网络与反馈神经网络&#xff09;、常见算法 进入 深度学习——卷积神…...

微服务架构面试内容整理-API 网关-Gateway

Spring Cloud Gateway 是一个用于构建 API 网关的框架,它为微服务架构提供了灵活的路由和过滤功能。作为 Spring Cloud 生态的一部分,Gateway 提供了易于使用的 API 和强大的功能,适合用于现代微服务架构中的请求管理和服务交互。以下是 Spring Cloud Gateway 的主要特点、工…...

22.04Ubuntu---ROS2使用rclcpp编写节点C++

节点需要存在于功能包当中&#xff0c;功能包需要存在于工作空间当中。 所以我们要想创建节点&#xff0c;就要先创建一个工作空间&#xff0c;再创建功能包。 第一步&#xff1a;创建工作空间 mkdir -p chapt2_ws/src/ 第二步&#xff1a;创建example_cpp功能包&#xff0c…...

XML 现实案例:深入解析与应用

XML 现实案例:深入解析与应用 XML(可扩展标记语言)自1998年成为W3C推荐标准以来,一直是数据交换和存储的重要工具。它是一种用于标记电子文件的结构化语言,使得数据不仅人类可读,而且机器可处理。本文将探讨XML在现实世界中的应用案例,展示其如何在不同领域中发挥作用。…...

Spring源码(十二):Spring MVC之Spring Boot

本篇将详细讨论Spring Boot 的启动/加载、处理请求的具体流程。我们先从一个简单的Spring Boot项目日志开始分析&#xff08;这里假设读者已经仔细阅读完了前面的文章&#xff0c;且对Spring源码有一定深度的了解&#xff0c;否则会看得一脸懵逼&#xff09;。 本文为2024重置…...

Kafka 之事务消息

前言&#xff1a; 在分布式消息系统中&#xff0c;事务消息也是一个热门课题&#xff0c;在项目的实际业务场景中&#xff0c;如果用到事务消息的场景也不少见&#xff0c;那 Kafka 作为一个高性能的分布式消息中间件&#xff0c;同样也支持事务消息&#xff0c;本篇我们将对 …...

小菜家教平台(四):基于SpringBoot+Vue打造一站式学习管理系统

前言 昨天配置完了过滤器&#xff0c;权限检验&#xff0c;基本的SpringSecurity功能已经配置的差不多了&#xff0c;今天继续开发&#xff0c;明天可能会暂停一天整理一下需求&#xff0c;然后就进行CRUD了。 今日进度 补充SpringSecurity异常处理和全局异常处理器 详细操作…...

解决 Vue3、Vite 和 TypeScript 开发环境下跨域的问题,实现前后端数据传递

引言 本文介绍如何在开发环境下解决 Vite 前端&#xff08;端口 3000&#xff09;和后端&#xff08;端口 80&#xff09;之间的跨域问题&#xff1a; 在开发环境中&#xff0c;前端使用的 Vite 端口与后端端口不一致&#xff0c;会产生跨域错误提示&#xff1a; Access to X…...

量化交易系统开发-实时行情自动化交易-3.3.数据采集流程

19年创业做过一年的量化交易但没有成功&#xff0c;作为交易系统的开发人员积累了一些经验&#xff0c;最近想重新研究交易系统&#xff0c;一边整理一边写出来一些思考供大家参考&#xff0c;也希望跟做量化的朋友有更多的交流和合作。 接下来说说数据采集流程&#xff0c;后…...

Vue记事本应用实现教程

文章目录 1. 项目介绍2. 开发环境准备3. 设计应用界面4. 创建Vue实例和数据模型5. 实现记事本功能5.1 添加新记事项5.2 删除记事项5.3 清空所有记事 6. 添加样式7. 功能扩展&#xff1a;显示创建时间8. 功能扩展&#xff1a;记事项搜索9. 完整代码10. Vue知识点解析10.1 数据绑…...

C++初阶-list的底层

目录 1.std::list实现的所有代码 2.list的简单介绍 2.1实现list的类 2.2_list_iterator的实现 2.2.1_list_iterator实现的原因和好处 2.2.2_list_iterator实现 2.3_list_node的实现 2.3.1. 避免递归的模板依赖 2.3.2. 内存布局一致性 2.3.3. 类型安全的替代方案 2.3.…...

测试markdown--肇兴

day1&#xff1a; 1、去程&#xff1a;7:04 --11:32高铁 高铁右转上售票大厅2楼&#xff0c;穿过候车厅下一楼&#xff0c;上大巴车 &#xffe5;10/人 **2、到达&#xff1a;**12点多到达寨子&#xff0c;买门票&#xff0c;美团/抖音&#xff1a;&#xffe5;78人 3、中饭&a…...

【AI学习】三、AI算法中的向量

在人工智能&#xff08;AI&#xff09;算法中&#xff0c;向量&#xff08;Vector&#xff09;是一种将现实世界中的数据&#xff08;如图像、文本、音频等&#xff09;转化为计算机可处理的数值型特征表示的工具。它是连接人类认知&#xff08;如语义、视觉特征&#xff09;与…...

CMake控制VS2022项目文件分组

我们可以通过 CMake 控制源文件的组织结构,使它们在 VS 解决方案资源管理器中以“组”(Filter)的形式进行分类展示。 🎯 目标 通过 CMake 脚本将 .cpp、.h 等源文件分组显示在 Visual Studio 2022 的解决方案资源管理器中。 ✅ 支持的方法汇总(共4种) 方法描述是否推荐…...

dify打造数据可视化图表

一、概述 在日常工作和学习中&#xff0c;我们经常需要和数据打交道。无论是分析报告、项目展示&#xff0c;还是简单的数据洞察&#xff0c;一个清晰直观的图表&#xff0c;往往能胜过千言万语。 一款能让数据可视化变得超级简单的 MCP Server&#xff0c;由蚂蚁集团 AntV 团队…...

安宝特方案丨船舶智造的“AR+AI+作业标准化管理解决方案”(装配)

船舶制造装配管理现状&#xff1a;装配工作依赖人工经验&#xff0c;装配工人凭借长期实践积累的操作技巧完成零部件组装。企业通常制定了装配作业指导书&#xff0c;但在实际执行中&#xff0c;工人对指导书的理解和遵循程度参差不齐。 船舶装配过程中的挑战与需求 挑战 (1…...

pycharm 设置环境出错

pycharm 设置环境出错 pycharm 新建项目&#xff0c;设置虚拟环境&#xff0c;出错 pycharm 出错 Cannot open Local Failed to start [powershell.exe, -NoExit, -ExecutionPolicy, Bypass, -File, C:\Program Files\JetBrains\PyCharm 2024.1.3\plugins\terminal\shell-int…...

【AI News | 20250609】每日AI进展

AI Repos 1、OpenHands-Versa OpenHands-Versa 是一个通用型 AI 智能体&#xff0c;通过结合代码编辑与执行、网络搜索、多模态网络浏览和文件访问等通用工具&#xff0c;在软件工程、网络导航和工作流自动化等多个领域展现出卓越性能。它在 SWE-Bench Multimodal、GAIA 和 Th…...

.Net Framework 4/C# 面向对象编程进阶

一、继承 (一)使用继承 子类可以继承父类原有的属性和方法,也可以增加原来父类不具备的属性和方法,或者直接重写父类中的某些方法。 C# 中使用“:”来表示两个类的继承。子类不能访问父类的私有成员,但是可以访问其公有成员,即只要使用 public 声明类成员,就既可以让一…...