【JS封装-工具函数】强化编程实践:精选JavaScript函数封装集锦-关于工具函数 (如深度克隆、浅拷贝、递归、防抖和节流等)

目录

浅拷贝

深度克隆

递归函数示例:计算数组深度

防抖函数

节流函数

扁平化数组

检查对象是否为空

生成随机字符串

深度比较两个对象是否相等


浅拷贝

/*** 浅拷贝对象或数组。* @param {Object|Array} obj 要拷贝的对象或数组。* @returns {Object|Array} 新的拷贝对象或数组。*/
function shallowClone(obj) {if (Array.isArray(obj)) return obj.slice();if (typeof obj === 'object' && obj !== null) return Object.assign({}, obj);return obj;
}

深度克隆

/*** 深度克隆对象或数组。* @param {Object|Array} obj 要克隆的对象或数组。* @returns {Object|Array} 完全独立的新克隆对象或数组。*/
function deepClone(obj) {if (obj === null || typeof obj !== 'object') return obj;let clone = Array.isArray(obj) ? [] : {};for (let key in obj) {if (obj.hasOwnProperty(key)) {clone[key] = deepClone(obj[key]);}}}return clone;
}

递归函数示例:计算数组深度

/*** 计算数组的最大深度。* @param {Array} arr 输入数组。* @returns {number} 数组的深度。*/
function calculateDepth(arr) {let maxDepth = 0;arr.forEach(item => {if (Array.isArray(item)) {maxDepth = Math.max(maxDepth, calculateDepth(item) + 1);}});return maxDepth;
}

防抖函数

/*** 防抖函数,限制函数在一段时间内只执行一次。* @param {Function} func 要执行的函数。* @param {number} wait 延迟执行的时间(毫秒)。* @returns {Function} 返回防抖处理后的函数。*/
function debounce(func, wait) {let timeout;return function(...args) {clearTimeout(timeout);timeout = setTimeout(() => func.apply(this, args), wait);};
}

节流函数

/*** 节流函数,确保函数在规定时间内只执行一次。* @param {Function} func 要执行的函数。* @param {number} delay 规定的时间间隔(毫秒)。* @returns {Function} 返回节流处理后的函数。*/
function throttle(func, delay) {let lastExec = 0;return function(...args) {const now = Date.now();if (now - lastExec >= delay) {lastExec = now;func.apply(this, args);}};
}

扁平化数组

/*** 将嵌套数组扁平化为一维数组。* @param {Array} arr 原数组。* @param {number} [depth=Infinity] 扁平化的深度,默认无限深。* @returns {Array} 扁平化后的数组。*/
function flattenArray(arr, depth = Infinity) {return arr.reduce((acc, val) => Array.isArray(val) && depth > 0 ? acc.concat(flattenArray(val, depth - 1)) : acc.concat(val), []);
}

检查对象是否为空

/*** 检查对象是否为空(没有可枚举属性)。* @param {Object} obj 待检查的对象。* @returns {boolean} 如果对象为空返回true,否则返回false。*/
function isEmptyObject(obj) {return Object.keys(obj).length === 0;
}

生成随机字符串

/*** 生成指定长度的随机字符串。* @param {number} length 字符串长度。* @returns {string} 随机字符串。*/
function generateRandomString(length) {let result = '';const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';const charactersLength = characters.length;for (let i = 0; i < length; i++) {result += characters.charAt(Math.floor(Math.random() * charactersLength));}return result;
}

深度比较两个对象是否相等

/*** 深度比较两个对象是否相等。* @param {Object} obj1 对象1。* @param {Object} obj2 对象2。* @returns {boolean} 如果两个对象相等返回true,否则返回false。*/
function deepEqual(obj1, obj2) {if (obj1 === obj2) return true;if (typeof obj1 !== 'object' || obj1 === null || typeof obj2 !== 'object' || obj2 === null) {return false;}const keys1 = Object.keys(obj1);const keys2 = Object.keys(obj2);if (keys1.length !== keys2.length) return false;for (const key of keys1) {if (!keys2.includes(key) || !deepEqual(obj1[key], obj2[key])) {return false;}}}return true;
}

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

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

相关文章

腾讯云和windows11安装frp,实现内网穿透

一、内网穿透目的 实现公网上&#xff0c;访问到windows上启动的web服务 二、内网穿透的环境准备 公网服务器、windows11的电脑、frp软件(需要准备两个软件&#xff0c;一个是安装到公网服务器上的&#xff0c;一个是安装到windows上的) frp下载地址下载版本 1.此版本(老版…

C/C++|std::function 浅度解析

std::function 是 C 标准库中的一个通用多态函数包装器。它可以存储、复制和调用任意可调用目标&#xff08;函数、lambda 表达式、绑定表达式或其他函数对象&#xff09;。 std::function 占有固定尺寸的内存&#xff0c;这是因为它的实现方式决定了这一点。让我们深入探讨这一…

论文阅读:Indoor Scene Layout Estimation from a Single Image

项目地址&#xff1a;https://github.com/leVirve/lsun-room/tree/master 发表时间&#xff1a;2018 icpr 场景理解&#xff0c;在现实交互的众多方面中&#xff0c;因其在增强现实&#xff08;AR&#xff09;等应用中的相关性而得到广泛关注。场景理解可以分为几个子任务&…

C++ 内联函数 auto关键字

内联函数 用inline修饰的函数会成为内联函数&#xff0c;内联函数会在编译的阶段在调用函数的位置进行展开&#xff0c;不会涉及建立栈帧以提高效率&#xff0c;同时每一次的函数调用都会展开整个函数导致内存消耗的增加&#xff0c;是以空间换时间&#xff0c;所以内联函数比…

SpringSecurity入门(二)

8、获取用户认证信息 三种策略模式&#xff0c;调整通过修改VM options // 如果没有设置自定义的策略&#xff0c;就采用MODE_THREADLOCAL模式 public static final String MODE_THREADLOCAL "MODE_THREADLOCAL"; // 采用InheritableThreadLocal&#xff0c;它是Th…

最新下载:Navicat for MySQL 11软件安装视频教程

软件简介&#xff1a; Navicat for MySQL 是一款强大的 MySQL 数据库管理和开发工具&#xff0c;它为专业开发者提供了一套强大的足够尖端的工具&#xff0c;但对于新用户仍然易于学习。Navicat For Mysql中文网站&#xff1a;http://www.formysql.com/ Navicat for MySQL 基于…

NLP实战入门——文本分类任务(TextRNN,TextCNN,TextRNN_Att,TextRCNN,FastText,DPCNN,BERT,ERNIE)

本文参考自https://github.com/649453932/Chinese-Text-Classification-Pytorch?tabreadme-ov-file&#xff0c;https://github.com/leerumor/nlp_tutorial?tabreadme-ov-file&#xff0c;https://zhuanlan.zhihu.com/p/73176084&#xff0c;是为了进行NLP的一些典型模型的总…

如何远程桌面连接?

远程桌面连接是一种方便快捷的方式&#xff0c;可以帮助用户在不同地区的设备之间实现信息的远程通信。我们将介绍一种名为【天联】的组网产品&#xff0c;它可以帮助用户轻松实现远程桌面连接。 【天联】组网是一款异地组网内网穿透产品&#xff0c;由北京金万维科技有限公司…

绿联Nas docker 中 redis 老访问失败的排查

部署了一些服务&#xff0c;老隔3-5 天其他服务就联不上 redis 了&#xff0c;未确定具体原因&#xff0c;只记录观察到的现象 宿主机访问 只有 ipv6 绑定了&#xff0c;ipv4 绑定挂掉了 其他容器访问 也无法访问成功 当重启容器后&#xff1a; 一切又恢复正常。 可能的解…

递推8-----7-8 sdut-C语言实验-王小二切饼0)

7-8 sdut-C语言实验-王小二切饼 分数 20 全屏浏览 切换布局 作者 马新娟 单位 山东理工大学 王小二自夸刀工不错&#xff0c;有人放一张大的煎饼在砧板上&#xff0c;问他&#xff1a;“饼不许离开砧板&#xff0c;切n(1<n<100)刀最多能分成多少块&#xff1f;” 输…

浅谈一下关系型数据库中json类型字段的处理

文章目录 背景mysql json typepostgresql jsonb type场景说明mysql实验案例postgresql 实验案例 总结 背景 最近涉及到在关系型数据库中解析json数据的问题,数据库表中有一个json类型的字段,业务场景涉及到展开此单行json数据为*多行数据并和其他的表进行join查询. 以往只是知…

一个完整的java项目通常包含哪些层次(很全面)

1.View层&#xff08;视图层&#xff09; 职责&#xff1a;负责数据的展示和用户交互。在Web应用中&#xff0c;View层通常与HTML、CSS和JavaScript等技术相关。 技术实现&#xff1a;在Spring MVC中&#xff0c;View层可以使用JSP、Thymeleaf、FreeMarker等模板引擎来实现。…

MATLAB | 透明度渐变颜色条

hey 各位好久不见&#xff0c;今天提供一段有趣的小代码&#xff0c;之前刷到公众号闻道研学的一篇推送MATLAB绘图技巧 | 设置颜色条的透明度&#xff08;附完整代码&#xff09;&#xff08;https://mp.weixin.qq.com/s/bVx8AVL9jGlatja51v4H0A&#xff09;&#xff0c;文章希…

机器学习周记(第四十二周:AT-LSTM)2024.6.3~2024.6.9

目录 摘要Abstract一、文献阅读1. 题目2. abstract3. 网络架构3.1 LSTM3.2 注意力机制概述3.3 AT-LSTM3.4 数据预处理 4. 文献解读4.1 Introduction4.2 创新点4.3 实验过程4.3.1 训练参数4.3.2 数据集4.3.3 实验设置4.3.4 实验结果 5. 基于pytorch的transformer 摘要 本周阅读…

免费,C++蓝桥杯等级考试真题--第11级(含答案解析和代码)

C蓝桥杯等级考试真题--第11级 答案&#xff1a;D 解析&#xff1a; A. a b; b a; 这种方式会导致a和b最终都等于b原来的值&#xff0c;因为a的原始值在被b覆盖前没有保存。 B. swap(a&#xff0c;b); 如果没有自定义swap函数或者没有包含相应的库&#xff0c;这个选项会编…

【C++题解】1389 - 数据分析

问题&#xff1a;1389 - 数据分析 类型&#xff1a;简单循环 题目描述&#xff1a; 该方法的操作方式为&#xff0c;如果要传递 2 个数字信息给友军&#xff0c;会直接传递给友军一个整数 n&#xff08;n 是一个 10 位以内的整数&#xff09;&#xff0c;该整数的长度代表要传…

汇编语言LDS指令

在8086架构的实模式下&#xff0c;LDS指令&#xff08;Load Pointer Using DS&#xff09;用于从内存中加载一个32位的指针到指定寄存器和DS寄存器。我们来详细解释一下这条指令为什么会修改DS段寄存器。 LDS指令的功能 LDS指令格式如下&#xff1a; LDS destination, sourc…

程序猿大战Python——运算符

常见的运算符 目标&#xff1a;了解Python中常见的运算符有哪些&#xff1f; 运算符是用于执行程序代码的操作运算。常见的运算符有&#xff1a; &#xff08;1&#xff09;算术运算符&#xff1a;、-、*、/、//、% 、**&#xff1b; &#xff08;2&#xff09;赋值运算符&am…

树莓派 ubuntu linux 去除蓝牙历史配对信息

linux 去除蓝牙历史配对信息 在Linux系统中&#xff0c;蓝牙配对信息通常存储在/var/lib/bluetooth目录下的文件中。要删除所有的历史配对信息&#xff0c;你可以删除这个目录下的所有文件。 以下是一个命令行示例&#xff0c;用于删除蓝牙历史配对信息&#xff1a; sudo rm…

macOS - 终端快捷键

本文转自 Mac 上“终端”中的键盘快捷键 https://support.apple.com/zh-cn/guide/terminal/trmlshtcts/mac 以下基于系统版本 macOS Sonoma 14 文章目录 Mac 上“终端”中的键盘快捷键1、使用“终端”窗口和标签页2、编辑命令行3、在“终端”窗口中选择和查找文本4、使用标记和…