JavaScript实现指定数量的并发限制的示例代码


Posted in Javascript onMarch 10, 2020

在网上看到这么一道题:

JavaScript实现指定数量的并发限制的示例代码

这道题跟鱼头这篇记录『什么是时间分片(Time Slicing)? 』有点相似,但不同的是这次是限制异步并发的数量。

所以话不多说,我们先来康康实现

首先我们来实现一个分割数组的函数~

const group = (list = [], max = 0) => {
  if (!list.length) {
    return list
  }
  let results = []
  for (let i = 0, len = list.length; i < len; i += max) {
    results.push(list.slice(i, i + max))
  }
  return results
}

这里就是根据指定的并发数量来分割数组。主要就是 for + slice ,这没啥好说的

接下来我们再来一个用 async + await 实现的请求集合封装。

我们通过 for...of 去遍历每一个异步函数,然后用 async + await 确保函数的执行顺序,再用 try...catch 来保证即使 reject 报错也不会导致无法继续执行任务。

const requestHandler = async (
  groupedUrl = [],
  callback = () => { }
) => {
  if (!groupedUrl.length) {
    callback()
    return groupedUrl
  }
  const newGroupedUrl = groupedUrl.map(fn => fn())
  const resultsMapper = (results) => results.map(callback)
  const data = await Promise.allSettled(newGroupedUrl).then(resultsMapper)
  return data;
}

接下来就是主函数

const sendRequest = async (
  urls = [],
  max = 0,
  callback = () => { }
) => {
  if (!urls.length) {
    return urls
  }
  const groupedUrls = group(urls, max)
  const results = []
  console.log('start !')
  for (let groupedUrl of groupedUrls) {
    try {
      const result = await requestHandler(groupedUrl, callback)
      results.push(result)
      console.log('go')
    } catch { }
  }
  console.log('done !')
  return results
}

这里就是利用了 for + async + await 来限制并发。等每次并发任务结果出来之后再执行下一次的任务。

我们执行下栗子:

const p1 = () => new Promise((resolve, reject) => setTimeout(reject, 1000, 'p1'))
const p2 = () => Promise.resolve(2)
const p3 = () => new Promise((resolve, reject) => setTimeout(resolve, 2000, 'p3'))
const p4 = () => Promise.resolve(4)
const p5 = () => new Promise((resolve, reject) => setTimeout(reject, 2000, 'p5'))
const p6 = () => Promise.resolve(6)
const p7 = () => new Promise((resolve, reject) => setTimeout(resolve, 1000, 'p7'))
const p8 = () => Promise.resolve(8)
const p9 = () => new Promise((resolve, reject) => setTimeout(reject, 1000, 'p9'))
const p10 = () => Promise.resolve(10)
const p11 = () => new Promise((resolve, reject) => setTimeout(resolve, 2000, 'p10'))
const p12 = () => Promise.resolve(12)
const p13 = () => new Promise((resolve, reject) => setTimeout(reject, 1000, 'p11'))
const p14 = () => Promise.resolve(14)

const ps = [p1, p2, p3, p4, p5, p6, p7, p8, p9, p10, p11, p12, p13, p14]
sendRequest(ps, 3, ({reason, value}) => {
  console.log(reason || value)
})

JavaScript实现指定数量的并发限制的示例代码

OK,我们看到结果是如我们所愿的

到此这篇关于JavaScript实现指定数量的并发限制的示例代码的文章就介绍到这了,更多相关JavaScript 指定数量并发限制内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
JavaScript 学习笔记(十四) 正则表达式
Jan 22 Javascript
基于MooTools的很有创意的滚动条时钟动画
Nov 14 Javascript
Jquery图片滚动与幻灯片的实例代码
Apr 08 Javascript
jQuery在html有效在jsp无效的原因及解决方法
Aug 02 Javascript
使用jQuery和PHP实现类似360功能开关效果
Feb 12 Javascript
JS中自定义定时器让它在某一时刻执行
Sep 02 Javascript
JS创建对象几种不同方法详解
Mar 01 Javascript
js动态获取子复选项并设计全选及提交的实现方法
Jun 24 Javascript
详解Angular-ui-BootStrap组件的解释以及使用
Jul 13 Javascript
傻瓜式vuex语法糖kiss-vuex整理
Dec 21 Javascript
js实现简单的贪吃蛇游戏
Apr 23 Javascript
JavaScript 去重和重复次数统计
Mar 31 Javascript
vue中的使用token的方法示例
Mar 10 #Javascript
vue瀑布流组件实现上拉加载更多
Mar 10 #Javascript
JS如何在数组指定位置插入元素
Mar 10 #Javascript
vue实现简单瀑布流布局
May 28 #Javascript
JavaScript观察者模式原理与用法实例详解
Mar 10 #Javascript
微信小程序用canvas画图并分享
Mar 09 #Javascript
JavaScript实现简单贪吃蛇效果
Mar 09 #Javascript
You might like
PHP 数据库树的遍历方法
2009/02/06 PHP
PHP生成json和xml类型接口数据格式
2015/05/17 PHP
详解PHP文件的自动加载(autoloading)
2018/02/04 PHP
php集成开发环境详解
2019/09/24 PHP
javascript getElementsByClassName函数
2010/04/01 Javascript
优化innerHTML操作(提高代码执行效率)
2011/08/20 Javascript
javascript中的变量作用域以及变量提升详细介绍
2013/10/24 Javascript
js简单实现删除记录时的提示效果
2013/12/05 Javascript
Javasipt:操作radio标签详解
2013/12/30 Javascript
js取得html iframe中的元素和变量值
2014/06/30 Javascript
jQuery模拟新浪微博首页滚动效果的方法
2015/03/11 Javascript
Javascript this 函数深入详解
2016/12/13 Javascript
Javascript 使用ajax与C#获取文件大小实例详解
2017/01/13 Javascript
js中getter和setter用法实例分析
2018/08/14 Javascript
p5.js临摹动态图形的方法
2019/10/23 Javascript
vue实现验证用户名是否可用
2021/01/20 Vue.js
[01:50]WODOTA制作 DOTA2中文宣传片《HERO》
2013/04/28 DOTA
python操作CouchDB的方法
2014/10/08 Python
Python的设计模式编程入门指南
2015/04/02 Python
Python版微信红包分配算法
2015/05/04 Python
Python端口扫描简单程序
2016/11/10 Python
Python处理文本文件中控制字符的方法
2017/02/07 Python
Python中int()函数的用法浅析
2017/10/17 Python
对python的文件内注释 help注释方法
2018/05/23 Python
Jupyter notebook在mac:linux上的配置和远程访问的方法
2019/01/14 Python
Python面向对象进阶学习
2019/05/21 Python
window7下的python2.7版本和python3.5版本的opencv-python安装过程
2019/10/24 Python
wxPython多个窗口的基本结构
2019/11/19 Python
Pytorch之保存读取模型实例
2019/12/30 Python
在django中form的label和verbose name的区别说明
2020/05/20 Python
Django扫码抽奖平台的配置过程详解
2021/01/14 Python
《望庐山瀑布》教学反思
2014/04/22 职场文书
银行纠风工作实施方案
2014/06/08 职场文书
小学见习报告
2015/06/23 职场文书
运动会跳远广播稿
2015/08/19 职场文书
CentOS7安装GlusterFS集群以及相关配置
2022/04/12 Servers