前端面试:如何实现并发请求数量控制?

题目:实现一个并发请求函数concurrencyRequest(urls, maxNum)
要求如下:

  • 要求最大并发数 maxNum;
  • 每当有一个请求返回,就留下一个空位,可以增加新的请求;
  • 所有请求完成后,结果按照 urls 里面的顺序依次打出;

思路

首先是比较最大请求数量和总的urls的数量,如果urls数量更小,直接全部发送,然后返回结果;否则先发送最大的请求数量,发送一个将正在发送的数量减一,并追加一个新的请求,直到请求发送完毕,返回全部结果。

  1. 初始化结果数组和当前正在请求的数组: 我们需要一个数组来存储每个请求的结果,还需要一个数组来存储当前正在执行的请求。

  2. 编写一个异步函数来执行单个请求: 这个函数负责发送请求,并将结果存储到结果数组中。同时,它会从正在执行的请求数组中移除已完成的请求。

  3. 使用循环和 Promise实现并发请求: 我们使用循环来初始化一定数量的并发请求,并将它们加入到正在执行的请求数组中。

  4. 递归调用函数以填补新的请求: 在请求完成后,我们可以递归调用函数,从 URL 数组中取出新的请求,然后再次执行。

实现

async function concurrencyRequest(urls: string[], maxNum: number) {return new Promise((resolve) => {const results: any = [];const executing: any = [];const run = async (url: any) => {try {const response = await fetch(url);results.push(response);console.log("请求中", url);} catch (error) {results.push({ error: true, message: error.message });} finally {const index = executing.indexOf(url);if (index !== -1) {executing.splice(index, 1);}}if (urls.length > 0 && executing.length < maxNum) {const runUrl = urls.shift();run(runUrl);executing.push(runUrl);}if (urls.length === 0 && executing.length === 0) resolve(results);};// 初始化时,执行最多 maxNum 个请求for (let i = 0; i < Math.min(maxNum, urls.length); i++) {const url = urls.shift();run(url);executing.push(url);}});
}// 使用
const urls = ["url1", "url2", "url3", 'url4','url5','url6', 'url7','url8'];
const maxNum = 3;concurrencyRequest(urls, maxNum).then(results => {console.log("结果", results);}).catch(error => {console.error("发生错误:", error);});

效果:
在这里插入图片描述
在这里插入图片描述

try/catch/finally

相信大家都会用try…catch吧, 这里简单介绍一下。在 JS中,try...catch 语句用于捕获异常,而 finally 语句块中的代码将在 try 块和任何 catch 块之后执行,无论是否发生异常。
无论是否发生异常,finally 块中的代码都会被执行。这意味着,无论 try 块中的代码是否成功执行,catch 块是否执行,finally 中的代码都将执行。

例如:

try {// 一些可能抛出异常的代码console.log("Try block");throw new Error("An error occurred");
} catch (error) {// 捕获异常的代码console.error("Catch block:", error.message);
} finally {// 无论是否发生异常,都会执行的代码console.log("Finally block");
}// 输出:
// Try block
// Catch block: An error occurred
// Finally block

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

openGauss学习笔记-127 openGauss 数据库管理-设置账本数据库-修复账本数据库

文章目录 openGauss学习笔记-127 openGauss 数据库管理-设置账本数据库-修复账本数据库127.1 前提条件127.2 背景信息127.3 操作步骤 openGauss学习笔记-127 openGauss 数据库管理-设置账本数据库-修复账本数据库 127.1 前提条件 系统中需要有审计管理员或者具有审计管理员权…

【数据结构】C语言实现队列

目录 前言 1. 队列 1.1 队列的概念 1.2 队列的结构 2. 队列的实现 2.1 队列的定义 2.2 队列的初始化 2.3 入队 2.4 出队 2.5 获取队头元素 2.6 获取队尾元素 2.7 判断空队列 2.8 队列的销毁 3. 队列完整源码 Queue.h Queue.c &#x1f388;个人主页&#xff1a…

电磁场与电磁波part4--时变电磁场

1、采用洛伦兹条件使得矢量位 与标量位 分离在两个独立的方程中&#xff0c;且矢量位 仅与电流密度 有关&#xff0c;而标量位 仅与电荷密度 有关。 2、电磁能量守恒定理&#xff08;坡印廷定理&#xff09; 即减少的电磁能量电磁场所做的功流出的电磁能量 3、设u(r,t)是…

【Flink】核心概念:并行度与算子链

并行度&#xff08;Parallelism&#xff09; 当要处理的数据量非常大时&#xff0c;我们可以把一个算子操作&#xff0c;“复制”多份到多个节点&#xff0c;数据来了之后就可以到其中任意一个执行。这样一来&#xff0c;一个算子任务就被拆分成了多个并行的“子任务”&#x…

340条样本就能让GPT-4崩溃,输出有害内容高达95%?OpenAI的安全防护措施再次失效

仅需340个示例微调GPT-4&#xff0c;即可绕过安全限制&#xff0c;让模型说出“枪支改装方法”、“生化武器制作过程”等有害内容&#xff1f; OpenAI的安全防护措施再次失效&#xff0c;攻击的成功率高达95%&#xff01; 近日&#xff0c;美国顶尖大学UIUC与斯坦福联合对GPT…

Vue面试题

1. 解释单向数据流和双向数据绑定 对于 Vue 来说&#xff0c;组件之间的数据传递具有单向数据流这样的特性称为单向数据流&#xff0c;单向数据流&#xff08;Unidirectional data flow&#xff09;方式使用一个上传数据流和一个下传数据流进行双向数据通信&#xff0c;两个数…

数据分析思维与模型:相关分析法

相关分析法是一种用于研究两个或多个变量之间关系强度和方向的统计方法。这种方法在多个领域&#xff0c;如经济学、心理学、社会科学和自然科学中都有广泛应用。其核心是通过计算相关系数来量化变量之间的相关性。以下是相关分析法的一些基本概念和步骤&#xff1a; 选择变量…

小程序开通电子发票

总目录 文章目录 总目录前言结语 前言 随着人工智能的不断发展&#xff0c;机器学习这门技术也越来越重要&#xff0c;很多人都开启了学习机器学习&#xff0c;本文就介绍了机器学习的基础内容。 首先登录商户号&#xff1a;https://pay.weixin.qq.com/index.php/core/home/lo…

基于Python+OpenCV+Tensorflow图像迁移的艺术图片生成系统

欢迎大家点赞、收藏、关注、评论啦 &#xff0c;由于篇幅有限&#xff0c;只展示了部分核心代码。 文章目录 一项目简介 二、功能三、系统![请添加图片描述](https://img-blog.csdnimg.cn/dbda87069fc14c24b71c1eb4224dff05.png)四. 总结 一项目简介 基于PythonOpenCVTensorfl…

【汇编】[bx+idata]的寻址方式、SI和DI寄存器

文章目录 前言一、[bxidata]寻址方式1.1 [bxidata]的含义1.2 示例代码 二、SI和DI寄存器2.1 SI和DI寄存器是什么&#xff1f;2.2 [bxsi]和[bxdi]方式寻址2.3 [bxsiidata]和[bxdiidata] 总结 前言 在汇编语言中&#xff0c;寻址方式是指指令如何定位内存中的数据。BX寄存器与偏…

storage和正则表达式

一、Storage 1.认识Storage WebStorage主要提供了一种机制&#xff0c;可以让浏览器提供一种比cookie更直观的key、value存储方式&#xff1a; localStorage&#xff1a;本地存储&#xff0c;提供的是一种永久性的存储方法&#xff0c;在关闭掉网页重新打开时&#xff0c;存…

c语言-输入输出详解

文章目录 格式化输入输出占位符printfscanf 字符串输入输出puts&#xff08;&#xff09;gets&#xff08;&#xff09; 字符输入输出putchar&#xff08;&#xff09;getchar&#xff08;&#xff09; 区别 格式化输入输出 输入输出的库函数的头文件&#xff1a; #include<…

数据结构 堆

手写堆&#xff0c;而非stl中的堆 如何手写一个堆&#xff1f; //将数组建成堆 <O(n) for (int i n / 2;i;i--) //从n/2开始down down(i); 从n/2元素开始down&#xff0c;最下面一层元素的个数是n/2&#xff0c;其余上面的元素的个数是n/2&#xff0c;从最下面一层到最高层…

【论文复现】QuestEval:《QuestEval: Summarization Asks for Fact-based Evaluation》

以下是复现论文《QuestEval: Summarization Asks for Fact-based Evaluation》&#xff08;NAACL 2021&#xff09;代码https://github.com/ThomasScialom/QuestEval/的流程记录&#xff1a; 在服务器上conda创建虚拟环境questeval&#xff08;python版本于readme保持一致&…

【洛谷算法题】P5713-洛谷团队系统【入门2分支结构】

&#x1f468;‍&#x1f4bb;博客主页&#xff1a;花无缺 欢迎 点赞&#x1f44d; 收藏⭐ 留言&#x1f4dd; 加关注✅! 本文由 花无缺 原创 收录于专栏 【洛谷算法题】 文章目录 【洛谷算法题】P5713-洛谷团队系统【入门2分支结构】&#x1f30f;题目描述&#x1f30f;输入格…

C++--哈希表--散列--冲突--哈希闭散列模拟实现

文章目录 哈希概念一、哈希表闭散列的模拟实现二、开散列(哈希桶)的模拟实现数据类型定义析构函数插入查找删除 哈希概念 unordered系列的关联式容器之所以效率比较高&#xff0c;是因为其底层使用了哈希结构。 顺序结构以及平衡树中&#xff0c;元素关键码与其存储位置之间没…

C#WPF文本转语音实例

本文介绍C#WPF文本转语音实例 实现方法:使用类库(SpeechSynthesizer )实现的。 一、首先是安装程序包。 二、创建项目 需要添加引用using System.Speech.Synthesis; UI界面 <Windowx:Class="TextToSpeechDemo.MainWindow"xmlns="http://schemas.micr…

JVM垃圾回收相关概念

目录 一、System.gc()的理解 二、内存溢出与内存泄露 &#xff08;一&#xff09;OOM &#xff08;二&#xff09;内存泄露 三、StopTheWorld 四、垃圾回收的并行与并发 五、安全点与安全区域 &#xff08;一&#xff09;安全点 &#xff08;二&#xff09;安全区域 …

【JavaEE初阶】计算机是如何工作的

一、计算机发展史 计算的需求在⼈类的历史中是广泛存在的&#xff0c;发展大体经历了从⼀般计算⼯具到机械计算机到目前的电子计算机的发展历程。 人类对计算的需求&#xff0c;驱动我们不断的发明、改善计算机。目前这个时代是“电子计算机”的时代&#xff0c;发展的潮流是…

Qt按钮大全续集(QCommandLinkButton和QDialogButtonBox )

## QCommandLinkButton 控件简介 QCommandLinkButton 控件中文名是“命令链接按钮”。QCommandLinkButton 继承QPushButton。CommandLinkButton 控件和 RadioButton 相似,都是用于在互斥选项中选择一项。表面上同平面按钮一样,但是 CommandLinkButton 除带有正常的按钮上的文…