js实现数组扁平化
数组扁平化的方式
什么是数组扁平化?
数组扁平化:指将一个多维数组转化为一个一维数组。
例:将下面数组扁平化处理。
const arr = [1, [2, 3, [4, 5]]] // ---> [ 1, 2, 3, 4, 5 ]
1.使用flat()
flat()
方法是ES10提出的,它会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。(flat意为“水平的;平坦的”)
const result1 = arr.flat(Infinity) // 指定深度为无限
console.log(result1) // [ 1, 2, 3, 4, 5 ]
const result2 = arr.flat(1) // 指定深度为1
console.log(result2) // [ 1, 2, 3, [ 4, 5 ] ]
const result3 = arr.flat(2) // 指定深度为2
console.log(result3) // [ 1, 2, 3, 4, 5 ]
2.使用正则
以下做法得到的数组元素都会变成字符串,不建议使用;
const result1 = JSON.stringify(arr).replace(/\[|\]/g, '').split(',')
console.log(result1) // [ '1', '2', '3', '4', '5' ] 数组元素都变成了字符串
对以上方法进行优化处理;
const result2 = JSON.parse('[' + JSON.stringify(arr).replace(/\[|\]/g, '') + ']')
console.log(result2) // [ 1, 2, 3, 4, 5 ]
3.使用reduce()+concat()
使用reduce拿到数组的当前值和前一项值,判断当前值是否为数组,初始值设置为
[]
,然后使用concat进行数组合并。
reduce()方法:对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。
concat()方法:用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。
function flatten(arr) {
return arr.reduce((pre, current) => {
return pre.concat(Array.isArray(current) ? flatten(current) : current)
}, [])
}
const result = flatten(arr)
console.log(result) // [ 1, 2, 3, 4, 5 ]
4.使用函数递归
循环遍历数组,发现含有数组元素就进行递归处理,最终将数组转为一维数组。
const result = []
function exec(arr) {
arr.forEach(item => {
if (Array.isArray(item)) {
exec(item)
} else {
result.push(item)
}
})
}
exec(arr)
console.log(result) // [ 1, 2, 3, 4, 5 ]
5.使用扩展运算符+concat()
ES6新推出的扩展运算符能对数组进行降维处理(一次降一维),循环判断是否含有数组,进行concat合并。
- some()方法:测试数组中是不是至少有1个元素通过了被提供的函数测试(它返回的是一个Boolean类型的值)。
function flatten(arr) {
while (arr.some(item => Array.isArray(item))) {
arr = [].concat(...arr)
}
return arr
}
const result = flatten(arr)
console.log(result) // [ 1, 2, 3, 4, 5 ]
js实现数组扁平化的更多相关文章
- js中数组扁平化处理
- JavaScript数组常用方法解析和深层次js数组扁平化
前言 数组作为在开发中常用的集合,除了for循环遍历以外,还有很多内置对象的方法,包括map,以及数组筛选元素filter等. 注:文章结尾处附深层次数组扁平化方法操作. 作为引用数据类型的一种,在处 ...
- JS: 数组扁平化
数组扁平化 什么是数组扁平化? 数组扁平化就是将一个多层嵌套的数组 (Arrary) 转化为只有一层. // 多层嵌套 [1, 2, [3, 4]] // 一层 [1, 2, 3, 4] 递归实现 思 ...
- js技巧-使用reduce实现更简洁的数组对象去重和数组扁平化
Array.prototype.reduce()方法介绍: 感性认识reduce累加器: const arr = [1, 2, 3, 4]; const reducer = (accumulator, ...
- JS数组专题1️⃣ ➖ 数组扁平化
一.什么是数组扁平化 扁平化,顾名思义就是减少复杂性装饰,使其事物本身更简洁.简单,突出主题. 数组扁平化,对着上面意思套也知道了,就是将一个复杂的嵌套多层的数组,一层一层的转化为层级较少或者只有一层 ...
- js多维数组扁平化
数组扁平化,就是将多维数组碾平为一维数组,方便使用. 一:例如,一个二维数组 var arr = ['a', ['b', 2], ['c', 3, 'x']],将其扁平化: 1. 通过 apply ...
- javascrip的数组扁平化
扁平化 数组的扁平化,就是将一个嵌套多层的数组 array (嵌套可以是任何层数)转换为只有一层的数组. 举个例子,假设有个名为 flatten 的函数可以做到数组扁平化,效果就会如下: var ar ...
- js数组扁平化
看到一个有趣的题目: var arr = [ [1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14] ] ] ], 10]; 一个多维 ...
- js数据结构处理--------扁平化数组处理为树结构数据
将扁平化的数组处理为树结构数据,我们可以利用对象来处理,对象的复制是浅拷贝,指向相同的内存地址: var arr = [ { id: 0, pid: -1, name: 'sadas' }, { id ...
随机推荐
- Python+selenium之键盘和鼠标事件
- 进击的 Ansible(二):如何快速搞定生产环境 Ansible 项目布局?
Tips:与前文 <进击的 Ansible(一):Ansible 快速入门> 一样,本文使用的 Ansible 版本 2.5.4,项目演示环境 MacOS.由于 Ansible 项目开发活 ...
- 实验四 Web服务器1-socket编程
一.任务详情基于华为鲲鹏云服务器CentOS中(或Ubuntu),使用Linux Socket实现: 1. time服务器的客户端服务器,提交程序运行截图 2. echo服务器的客户端服务器,提交程序 ...
- Python如何支持读入gz压缩或未压缩文件?
目录 需求 示例代码 笨办法 Pythonic方法 需求 要写一个接口,同时支持压缩和未压缩文件读入 示例代码 笨办法 import os import gzip filename = sys.arg ...
- R语言与医学统计图形【1】par函数
张铁军,陈兴栋等 著 R语言基础绘图系统 基础绘图包之高级绘图函数--par函数 基础绘图包并非指单独某个包,而是由几个R包联合起来的一个联盟,比如graphics.grDevices等. 掌握par ...
- nodejs-os模块
JavaScript 标准参考教程(alpha) 草稿二:Node.js os模块 GitHub TOP os模块 来自<JavaScript 标准参考教程(alpha)>,by 阮一峰 ...
- [php反序列化] CVE-2020-15148(Yii2 反序列化漏洞) 漏洞复现
漏洞影响范围 Yii2 < 2.0.38 环境搭建 Yii2.0.37 漏洞分析 首先定位到漏洞起始点 为什么是这儿?我们该怎么发现是某个类的某个函数?为什么不是其他函数? 一般是__destr ...
- Linux磁盘分区(二)之挂载卸载常用命令
Linux磁盘分区(二)之挂载卸载常用命令 转自:https://blog.csdn.net/qq_36183935/article/details/81053383 https: ...
- 【编程思想】【设计模式】【基础模式Fundamental】delegation_pattern
Python版 https://github.com/faif/python-patterns/blob/master/fundamental/delegation_pattern.py #!/usr ...
- OSGI 理论知识
下面列出了主要的控制台命令: 表 1. Equinox OSGi 主要的控制台命令表 类别 命令 含义 控制框架 launch 启动框架 shutdown 停止框架 close 关闭.退出框架 exi ...