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

题目:实现一个并发请求函数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.mfbz.cn/a/165135.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

.babyk勒索病毒解析:恶意更新如何威胁您的数据安全

导言&#xff1a; 在数字时代&#xff0c;威胁不断进化&#xff0c;其中之一就是.babyk勒索病毒。这种病毒采用高级加密算法&#xff0c;将用户文件锁定&#xff0c;并要求支付赎金以获取解密密钥。本文91数据恢复将深入介绍.babyk勒索病毒的特点、如何应对被加密的数据&#…

【Promise12数据集】Promise12数据集介绍和预处理

【Segment Anything Model】做分割的专栏链接&#xff0c;欢迎来学习。 【博主微信】cvxiayixiao 本专栏为公开数据集的介绍和预处理&#xff0c;持续更新中。 要是只想把Promise12数据集的raw形式分割为png形式&#xff0c;快速导航&#xff0c;直接看2&#xff0c;4标题即可 …

arcgis属性表十进制度转换成度分秒格式--转换坐标注记法

1、有一组点数据&#xff0c;如下&#xff1a; 2、为其添加XY坐标&#xff0c;如下&#xff1a; 打开属性表&#xff0c;可得到对应点的XY的十进制度坐标&#xff0c;如下&#xff1a; 3、将十进制度转换成度分秒格式&#xff0c;如下&#xff0c;使用转换坐标注记法工具&#…

FPGA实现平衡小车(文末开源!!)

FPGA平衡小车 一. 硬件介绍 底板资源: TB6612电机驱动芯片 * 2 MPU6050陀螺仪 WS2812 RGB彩色灯 * 4 红外接收头 ESP-01S WIFI 核心板 微相 A7_Lite Artix-7 FPGA开发板 电机采用的是平衡小车之家的MG310(GMR编码器)电机。底板上有两个TB6612芯片&#xff0c;可以驱动…

云原生微服务-理论篇

文章目录 分布式应用的需求分布式架构治理模式演进ESB 是什么&#xff1f;微服务架构 MSA微服务实践细节微服务治理框架sidercar 什么是service mesh&#xff1f;康威定律微服务的扩展性什么是MSA 架构&#xff1f;中台战略和微服务微服务总体架构组件微服务网关服务发现与路由…

【GUI】-- 10 贪吃蛇小游戏之静态面板绘制

GUI编程 04 贪吃蛇小游戏 4.1 第一步&#xff1a;先绘制一个静态的面板 首先&#xff0c;需要新建两个类&#xff0c;一个StartGame类作为游戏的主启动类&#xff1b;一个GamePanel类作为游戏的面板类。此外&#xff0c;再新建一个Data类作为数据中心(存放了小蛇各部分图像的…

Halcon (5):Halcon Solution Guide I basics 导论解析

文章目录 文章专栏前言文章目录翻译文档的说明 结论LOL比赛结局 文章专栏 Halcon开发 前言 今天开始看Halcon的官方文档。由于市面上的教学主要是以基础的语法&#xff0c;算子简单介绍为主。所以我还是得看官方的文本。别的不多说了。有道词英语词典&#xff0c;启动。 还有…

LeetCode【36】有效的数独

题目&#xff1a; 思路&#xff1a; https://blog.51cto.com/u_15072778/3788083 代码&#xff1a; public boolean isValidSudoku(char[][] board) {// 二维数组第一个标识 0-9行&#xff0c;第二个表示 0-9数字&#xff0c;存的内容boolean 表示第0-9行&#xff0c;0-9这些…

react之基于@reduxjs/toolkit使用react-redux

react之基于reduxjs/toolkit使用react-redux 一、配置基础环境二、使用React Toolkit 创建 counterStore三、为React注入store四、React组件使用store中的数据五、实现效果六、提交action传递参数七、异步状态操作 一、配置基础环境 1.使用cra快速创建一个react项目 npx crea…

摩根看好的前智能硬件头部品牌双11交易数据极度异常!——是模式创新还是饮鸩止渴?

文 | 螳螂观察 作者 | 李燃 双11狂欢已落下帷幕&#xff0c;各大品牌纷纷晒出优异的成绩单&#xff0c;摩根士丹利投资的智能硬件头部品牌凯迪仕也不例外。然而有爆料称&#xff0c;在自媒体平台发布霸榜各大榜单喜讯的凯迪仕智能锁&#xff0c;多个平台数据都表现出极度异常…

EEPROM与Flash的区别

EEPROM与Flash的区别 EEPROMEEPROM内部功能框图实现写入数据内部结构存储管在充电或放电状态下有着不同的阈值电压 问题点EEPROM是如何失效的呢&#xff1f;为何EEPROM不能做大呢&#xff1f; ------------------------------------------------------------------------------…

Apache ECharts简介

二十九、Apache ECharts 29.1 介绍 Apache ECharts 是一款基于 JavaScript 的数据可视化图表库&#xff0c;提供直观、生动、可交互、可个性化定制的数据可视化图表。 官网地址&#xff1a;https://echarts.apache.org/zh/index.html 常见效果展示&#xff1a; 1). 柱形图 …

centos7 探测某个tcp端口是否在监听

脚本 nc -vz 192.168.3.128 60001 if [ $? -eq 0 ]; thenecho "tcp succeed" elseecho "tcp failed" fi nc -vz 192.168.3.128 60001 探测192.168.3.128服务器上60001 tcp端口, -vz说明是探测TCP的 端口开启的情况 执行脚本 端口禁用情况 执行脚本

【半监督学习】CNN与Transformer的结合

本文介绍了几篇结合使用CNN和Transformer进行半监督学习的论文&#xff0c;CNN&Trans&#xff08;MIDL2022&#xff09;&#xff0c;Semi-ViT&#xff08;ECCV2022&#xff09;&#xff0c;Semiformer&#xff08;ECCV2022&#xff09;. Semi-Supervised Medical Image Seg…

webservice笔记

1&#xff0c;简介 webservice&#xff0c;是一种跨编程语言和跨操作系统平台的远程调用技术。 webservice三要素&#xff1a;soap、wsdl、uddi2&#xff0c;服务端 2.1创建项目 2.2 编写服务类&#xff0c;并发布服务 import com.test.service.impl.HelloServiceImpl; impo…

NI Package Manager创建程序包

NI Package Manager创建程序包 要使用PackageManager创建程序包&#xff0c;即把相关的组件都放在一个目录下&#xff0c;使用命令行创建程序包。 程序包是一个压缩文件&#xff0c;包含要安装到目标位置的所有文件。Package Manager创建的程序包扩展名为.nipkg。可以使用Pack…

linux网络——HTTPS加密原理

目录 一.HTTPS概述 二.概念准备 三.为什么要加密 四.常⻅的加密⽅式 1.对称加密 2.⾮对称加密 五.数据摘要&#xff0c;数字签名 六.HTTPS的加密过程探究 1.方案一——只使用对称加密 2.方案二——只使⽤⾮对称加密 3.方案三——双⽅都使⽤⾮对称加密 4.方案四——⾮…

气候更换,气运也会随之变化

天人合一&#xff0c;人天相应&#xff0c;人体与宇宙天体的运行互相感应相通&#xff0c;与大自然的万千变化紧密联系。阴阳转换&#xff0c;带来的气场和磁场的变化&#xff0c;对自然界万事万物和人影响很大。 蒹葭苍苍&#xff0c;白露为霜&#xff0c;所谓伊人&#xff0…

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

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

变量命名的规则与规范

变量命名的规则与规范 变量命名的规则不能使用关键字字母须区分大小写由字母、数字、_、$组成&#xff0c;且不能以数字开头 变量命名的规范起名须有一定的意义遵守小驼峰命名法 变量命名的规则 不能使用关键字 在JavaScript中声明变量不能使用JavaScript的常用关键字&#x…
最新文章