Javascript高级:深度解析与多种实现方式数组扁平化
数组扁平化:深度解析与多种实现方式
在JavaScript编程中,数组扁平化是一个常见的操作,指的是将一个多维数组转换成一个一维数组。这个过程中,所有嵌套的数组元素都会被“拉平”到同一个层级。数组扁平化在处理嵌套数据结构时非常有用,比如解析多层嵌套的JSON数据,或者处理从函数返回的嵌套数组结果。
为什么要数组扁平化?
- 简化数据处理:将多维数组转换为一维数组后,可以更方便地进行遍历、搜索、排序等操作。
- 统一数据结构:在处理来自不同源的数据时,可能需要将它们转换为统一的一维数组结构。
- 优化性能:在某些情况下,扁平化数组可以减少嵌套层级,从而提高算法的效率。
数组扁平化的几种实现方式
- 递归方法
递归是处理嵌套结构的一种自然方式。通过递归函数,可以遍历每一层数组,并将其元素添加到结果数组中。
function flattenArray(arr) {let result = [];arr.forEach(item => {if (Array.isArray(item)) {result = result.concat(flattenArray(item));} else {result.push(item);}});return result;
}const nestedArray = [1, [2, [3, [4]], 5]];
console.log(flattenArray(nestedArray)); // 输出: [1, 2, 3, 4, 5]
- 使用
Array.prototype.reduce和递归
reduce方法也可以用来实现数组扁平化,结合递归可以处理任意深度的嵌套。
function flattenArray(arr) {return arr.reduce((acc, val) => Array.isArray(val) ? acc.concat(flattenArray(val)) : acc.concat(val), []);
}const nestedArray = [1, [2, [3, [4]], 5]];
console.log(flattenArray(nestedArray)); // 输出: [1, 2, 3, 4, 5]
- 使用
Array.prototype.flat(ES2019引入)
ES2019引入了Array.prototype.flat方法,可以方便地将数组扁平化到指定深度。如果不指定深度,则默认扁平化一层。
const nestedArray = [1, [2, [3, [4]], 5]];
const flatArray = nestedArray.flat(Infinity); // Infinity表示扁平化所有层级
console.log(flatArray); // 输出: [1, 2, 3, 4, 5]
- 使用堆栈模拟递归
为了避免递归可能带来的性能问题和栈溢出风险,可以使用堆栈来模拟递归过程。
function flattenArray(arr) {const stack = [...arr];const result = [];while (stack.length) {const next = stack.pop();if (Array.isArray(next)) {stack.push(...next);} else {result.push(next);}}// 由于是从后往前遍历,结果需要反转return result.reverse();
}// 或者,为了避免反转,可以改用从前往后遍历并收集到数组开头
function flattenArrayIterative(arr) {const stack = [...arr];const result = [];let index = result.length;while (stack.length) {const next = stack.pop();if (Array.isArray(next)) {for (let i = next.length - 1; i >= 0; i--) {stack.push(next[i]);}} else {result[index++] = next;}}return result;
}const nestedArray = [1, [2, [3, [4]], 5]];
console.log(flattenArrayIterative(nestedArray)); // 输出: [1, 2, 3, 4, 5]
注意事项
- 在选择扁平化方法时,要考虑数组的深度和元素的类型。如果数组嵌套层级很深,递归方法可能会导致栈溢出,此时可以选择堆栈模拟或
Array.prototype.flat方法。 - 如果数组中包含非数组元素(如对象、字符串等),要确保扁平化过程不会破坏这些元素的结构。
Array.prototype.flat方法是处理扁平化的最简单方式,但它是在ES2019中引入的,因此在使用时需要注意兼容性问题。对于不支持该方法的旧环境,可以使用其他方法实现扁平化。
综上所述,数组扁平化是处理嵌套数据结构的重要操作之一。通过选择合适的方法,可以高效地实现数组扁平化,从而简化数据处理过程。
相关文章:
Javascript高级:深度解析与多种实现方式数组扁平化
数组扁平化:深度解析与多种实现方式 在JavaScript编程中,数组扁平化是一个常见的操作,指的是将一个多维数组转换成一个一维数组。这个过程中,所有嵌套的数组元素都会被“拉平”到同一个层级。数组扁平化在处理嵌套数据结构时非常…...
SpringBoot Data Redis连接Redis-Cluster集群
使用SpringBoot Data Redis无法连接Redis-Cluster集群 最近在研究系统高并发下的缓存架构,因此自己在自己买的云服务器上搭建好Redis 5.0 版本的集群后,使用springboot的 RedisTemplate连接是发现总是访问不到集群节点。上网百度了发现没有好的解决办法&…...
计算机网络——TCP篇
TCP篇 基本认知 TCP和UDP的区别? TCP 和 UDP 可以使用同一个端口吗? 可以的 传输层中 TCP 和 UDP在内核中是两个完全独立的软件模块。可以根据协议字段来选择不同的模块来处理。 TCP 连接建立 TCP 三次握手过程是怎样的? 一次握手:客户端发送带有 …...
【网络安全面经】技术性问题3
11. 一次完整的 HTTP 请求过程 域名解析:通过 DNS 将域名转换为 IP 地址,如上述 DNS 的工作原理。建立 TCP 连接:客户端向服务器发送 SYN 报文段,经过三次握手建立 TCP 连接。发送 HTTP 请求:客户端向服务器发送 HTTP…...
前后端交互之动态列
一. 情景 在做项目时,有时候后会遇到后端使用了聚合函数,导致生成的对象的属性数量或数量不固定,因此无法建立一个与之对应的对象来向前端传递数据,这时可以采用NameDataListVO向前端传递数据。 Data Builder AllArgsConstructo…...
递归(3)----力扣40组合数2,力扣473火柴拼正方形
给定一个候选人编号的集合 candidates 和一个目标数 target ,找出 candidates 中所有可以使数字和为 target 的组合。 candidates 中的每个数字在每个组合中只能使用 一次 。 注意:解集不能包含重复的组合。 示例 1: 输入: candidates [10,1,2,7,6,1…...
十一:HTTP 状态码详解:解读每一个响应背后的意义
HTTP(超文本传输协议)是网络通信的基石之一,主要用于客户端(例如浏览器)和服务器之间的通信。为了让服务器能准确地向客户端反馈请求的处理状态,HTTP设计了一套标准的状态码。每一个状态码代表了特定的含义,指示了请求的状态、潜在的问题或成功的信息。 1. 信息响应 (1…...
《译文》2024年11月数维杯国际大学生数学建模挑战赛题目
# 赛题正式发布 2024年第十届数维杯国际大学生数学建模挑战赛顺利开赛,竞赛开始时间为北京时间2024年11月15日09:00至北京时间2024年11月19日09:00,共计4天,竞赛题目正式发布,快来一起围观,你认为今年的哪个题目更具有…...
shell命令统计文件行数之和
你可以使用以下 shell 命令来统计每个 .txt 文件的行数,并将其加和在一起: find . -name "*.txt" -not -name "*.json" -exec wc -l {} + | awk {sum += $1} END {print sum} 解释: find . -name "*.txt" -not -name "*.json": f…...
第02章 CentOS基本操作
2.文件基本操作【文件操作(一)】 目标 理解Linux下路径的表示方法能够使用命令(mkdir和touch)在指定位置创建目录和文件能够使用命令(rm)删除指定的目录和文件能够使用命令(ls)列出目录里的文件能够使用命令(cat,head,tail,less,more)查看文件内容理解标…...
241113.学习日志——[CSDIY] [ByteDance] 后端训练营 [02]
CSDIY:这是一个非科班学生的努力之路,从今天开始这个系列会长期更新,(最好做到日更),我会慢慢把自己目前对CS的努力逐一上传,帮助那些和我一样有着梦想的玩家取得胜利!!&…...
【HOT100第三天】和为K的子数组,最大子数组和,合并区间,轮转数组
今天练的是子串和子数组专题 ~ (前缀和那里差点学死了) 560.和为K的子数组 给你一个整数数组 nums 和一个整数 k ,请你统计并返回 该数组中和为 k 的子数组的个数 。 子数组是数组中元素的连续非空序列。 先写个暴力法,用昨天刚学…...
设计模式-Adapter(适配器模式)GO语言版本
前言 个人感觉Adapter模式核心就在于接口之间的转换。将已有的一些接口转换成其他接口形式。并且一般用于对象上,而不是系统上 问题 就用一个简单的问题,懂数据结构的同学可能知道双端队列。那么就用双端队列实现一个栈(stack)或…...
SAM_Med2D 训练完成后boxes_prompt没有生成mask的问题
之前对着这这篇文章去微调SAM_Med2D(windows环境),发现boxes_prompt空空如也。查找了好长时间问题SAM-Med2D 大模型学习笔记(续):训练自己数据集_sam训练自己数据集-CSDN博客 今天在看label2image_test.json文件的时候发现了一些端倪: 官方…...
游戏引擎学习第18天
clang-format 相关的配置可以参考下面 .clang-format 是用来配置代码格式化规则的文件,主要用于 Clang-Format 工具。以下是 .clang-format 文件中的一些常用设置: 1. 基础设置 Language: Cpp # 指定语言 (C, C, Java, JavaScript, etc…...
Kotlin return与return@forEachIndexed
Kotlin return与returnforEachIndexed fun main() {val data arrayOf(0, 1, 2, 3, 4)println("a")data.forEachIndexed { index, v ->if (v 2) {//类似while循环中的continue//跳过,继续下一个forEachIndexed迭代returnforEachIndexed}println("…...
基于Canny边缘检测和轮廓检测
这段代码实现了基于Canny边缘检测和轮廓检测,从图像中筛选出面积较大的矩形,并使用OpenCV和Matplotlib显示结果。主要流程如下: 步骤详解: 读取图像: img cv2.imread(U:/1.png)使用cv2.imread()加载图像。 转换为灰…...
力扣题目解析--合并k个升序链表
题目 给你一个链表数组,每个链表都已经按升序排列。 请你将所有链表合并到一个升序链表中,返回合并后的链表。 示例 1: 输入:lists [[1,4,5],[1,3,4],[2,6]] 输出:[1,1,2,3,4,4,5,6] 解释:链表数组如下…...
Linux:调试器-gdb/cgdb
文章目录 一、编译成debug1、-g 选项 二、gdb调试命令1、在CentOS系统下检查安装gdb2、进入gdb模式3、quit 退出gdb4、list (简写 l)显示文件内容5、b 打断点6、 r / run运行程序7、c 让程序直接运行完 三、cgdb1、info b查看打的所有断点2、d 删除断点3…...
『VUE』30. 生命周期的介绍(详细图文注释)
目录 生命周期生命周期的8阶段生命周期小例子总结 欢迎关注 『VUE』 专栏,持续更新中 欢迎关注 『VUE』 专栏,持续更新中 生命周期 每个 Vue 组件实例在创建时都需要经历一系列的初始化步骤,比如设置好数据侦听,编译模板…...
2026最权威的十大AI辅助论文工具实测分析
Ai论文网站排名(开题报告、文献综述、降aigc率、降重综合对比) TOP1. 千笔AI TOP2. aipasspaper TOP3. 清北论文 TOP4. 豆包 TOP5. kimi TOP6. deepseek 要降低AIGC也就是人工智能生成内容的检测率,关键之处在于减少机器生成的痕迹,还要增加文本的…...
如何快速上手Unitree Go2 ROS2 SDK:模块化机器人开发完整指南
如何快速上手Unitree Go2 ROS2 SDK:模块化机器人开发完整指南 【免费下载链接】go2_ros2_sdk Unofficial ROS2 SDK support for Unitree GO2 AIR/PRO/EDU 项目地址: https://gitcode.com/gh_mirrors/go/go2_ros2_sdk Unitree Go2 ROS2 SDK是为宇树科技GO2系列…...
用C语言手搓一个聊天室服务器:从socket到多线程的保姆级踩坑实录
用C语言手搓一个聊天室服务器:从socket到多线程的保姆级踩坑实录 深夜两点,屏幕的蓝光映在脸上,第17次编译失败后,我盯着gcc报出的"segmentation fault"陷入了沉思。这就是用C语言实现网络服务的魅力所在——没有现成的…...
HS2-HF Patch深度技术解析:专业级游戏MOD集成框架设计
HS2-HF Patch深度技术解析:专业级游戏MOD集成框架设计 【免费下载链接】HS2-HF_Patch Automatically translate, uncensor and update HoneySelect2! 项目地址: https://gitcode.com/gh_mirrors/hs/HS2-HF_Patch HS2-HF Patch是一个针对HoneySelect2游戏的高…...
Seraphine:你的英雄联盟智能游戏伙伴,让每一局游戏都更从容
Seraphine:你的英雄联盟智能游戏伙伴,让每一局游戏都更从容 【免费下载链接】Seraphine 英雄联盟战绩查询工具 项目地址: https://gitcode.com/gh_mirrors/se/Seraphine 你是否曾在英雄联盟的BP阶段犹豫不决,错过了最佳选择࿱…...
不止于仿真:将Simulink开关电源模型与实物参数对标(以48V反激电源为例)
从虚拟到现实:Simulink开关电源仿真与工程落地的深度校准指南 在电力电子设计领域,仿真工具早已成为工程师的左膀右臂。Simulink凭借其直观的模块化界面和强大的计算引擎,让复杂的开关电源设计变得可视化。然而,当仿真波形完美呈现…...
告别Excel!用JimuReport的SQL数据源,5分钟搞定学生信息报表(附完整SQL语句)
告别Excel!用SQL数据源5分钟生成学生信息报表的实战指南 每次期中考试后,张老师都要面对同样的噩梦:从教务系统导出学生名单,在Excel里手动调整格式、添加班级平均分、按成绩排序,最后打印分发给各科任课教师。上周五&…...
终极指南:如何彻底解锁《原神》60帧限制?完整免费解决方案
终极指南:如何彻底解锁《原神》60帧限制?完整免费解决方案 【免费下载链接】genshin-fps-unlock unlocks the 60 fps cap 项目地址: https://gitcode.com/gh_mirrors/ge/genshin-fps-unlock 你是一个文章写手,你负责为开源项目写专业易…...
Bebas Neue 开源字体技术解析:几何美学与多平台兼容性实现
Bebas Neue 开源字体技术解析:几何美学与多平台兼容性实现 【免费下载链接】Bebas-Neue Bebas Neue font 项目地址: https://gitcode.com/gh_mirrors/be/Bebas-Neue Bebas Neue 是一款基于 SIL Open Font License 1.1 许可证的开源显示字体,专为标…...
HBase集群部署避坑指南:从NoNode for /hbase/master错误到稳定启动
1. 遇到NoNode错误时别慌,先看懂它在说什么 第一次看到"HBase报错ERROR: KeeperErrorCode NoNode for /hbase/master"这个错误时,我正端着咖啡准备庆祝集群启动成功。结果这行红字直接给我泼了盆冷水——相信很多新手朋友都有类似的经历。这个…...
