JS: 数组扁平化
数组扁平化
什么是数组扁平化?
数组扁平化就是将一个多层嵌套的数组 (Arrary) 转化为只有一层。
// 多层嵌套
[1, 2, [3, 4]] // 一层
[1, 2, 3, 4]
递归实现
思路是先循环数组,遇到嵌套就递归。
function flatten(arr) {
let res = [];
for (let i=0; i<arr.length; i++) {
if (Array.isArray(arr[i])) {
res = res.concat(flatten(arr[i]));
} else {
res.push(arr[i]);
}
}
return res;
} flatten([1, 2, [3, 4]]); // [1, 2, 3, 4]
reduce
实现reduce方法接受一个函数作为参数,这个函数作为一个累加器,从左到右遍历 (升序) 整个类型数组,最后将结果汇总为单个值返回。
reduce方法还接受一个可选的参数
initialValue
,作为第一次调用callback函数
时的第一个参数的值。 如果没有提供初始值,则将使用数组中的第一个元素。 在没有初始值的空数组上调用 reduce 将报错。reducer 函数接收4个参数:
- Accumulator (acc) (累计器)
- Current Value (cur) (当前值)
- Current Index (idx) (当前索引) 可选
- Source Array (src) (源数组) 可选
reducer 函数的返回值分配给累计器,该返回值在数组的每个迭代中被记住,并最后成为最终的单个结果值。
function flatten(arr) {
return arr.reduce((acc, cur)=> {
// 遇到嵌套就递归
return acc.concat(Array.isArray(cur) ? flatten(cur) : cur);
}, []);
} flatten([1, 2, [3, 4]]); // [1, 2, 3, 4]
使用扩展运算符
...
some()
方法测试数组中的某些元素是否通过由提供的函数实现的测试,返回boolean
值。注意:对于放在空数组上的任何条件,此方法返回
false
。function flatten(arr) {
// 循环展开嵌套的数组,直到没有嵌套
while(arr.some(item => Array.isArray(item))) {
arr = [].concat(...arr);
}
return arr;
} flatten([1, 2, [3, [5, 6], 4]]); // [1, 2, 3, 5, 6, 4]
去重
数组去重要考虑的太多了,这里只简单的用
Set
返回一个不重复的值function flatten(arr) {
// 循环展开嵌套的数组,直到没有嵌套
while(arr.some(item => Array.isArray(item))) {
arr = [].concat(...arr);
}
return Array.from(new Set(arr));;
} flatten([1, 1, 2, [3, [3, 5, 6], 4]]); // [1, 2, 3, 5, 6, 4]
排序
扁平化的同时实现排序也是很常见的,前面提到的去重就可以在排序的同时进行,但排序要看具体需求来进行封装方法,这里就不进行探讨了。
JS: 数组扁平化的更多相关文章
- JavaScript数组常用方法解析和深层次js数组扁平化
前言 数组作为在开发中常用的集合,除了for循环遍历以外,还有很多内置对象的方法,包括map,以及数组筛选元素filter等. 注:文章结尾处附深层次数组扁平化方法操作. 作为引用数据类型的一种,在处 ...
- js数组扁平化
看到一个有趣的题目: var arr = [ [1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14] ] ] ], 10]; 一个多维 ...
- JS数组扁平化(flat)
需求:多维数组=>一维数组 let ary = [1, [2, [3, [4, 5]]], 6]; let str = JSON.stringify(ary); 第0种处理:直接的调用 arr_ ...
- js中数组扁平化处理
- 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 ...
- js实现数组扁平化
数组扁平化的方式 什么是数组扁平化? 数组扁平化:指将一个多维数组转化为一个一维数组. 例:将下面数组扁平化处理. const arr = [1, [2, 3, [4, 5]]] // ---> ...
- javascrip的数组扁平化
扁平化 数组的扁平化,就是将一个嵌套多层的数组 array (嵌套可以是任何层数)转换为只有一层的数组. 举个例子,假设有个名为 flatten 的函数可以做到数组扁平化,效果就会如下: var ar ...
随机推荐
- 转录组差异表达分析工具Ballgown
Ballgown是分析转录组差异表达的R包. 软件安装: 运行R, source(“http://bioconductor.org/biocLite.R”) biocLite(“ballgown”) ...
- 06 数据库入门学习-视图、sql注入、事务、存储过程
一.视图 1.什么是视图 视图本质是一张虚拟的表 2.为什么要用 为了原表的安全 只要有两大功能 1.隐藏部分数据,开放指定数据 2.视图可以将查询结果保存,减少sql语句的次数 特点: 1.视图使用 ...
- where /group by/ having/ order by/
1.order by 是 按字段 进行排序.. 字段后面可跟 desc 降序..asc 升序..默认为升序2.group by 是进行分组 查询3.having 和 where 都属于 条件过滤 区别 ...
- cmake检测g++编译器是否支持c++11
# 相关链接:https://cmake.org/cmake/help/v3.0/module/CheckCXXCompilerFlag.htmlinclude(CheckCXXCompilerF ...
- spring AbstractRoutingDataSource实现动态数据源切换
使用Spring 提供的 AbstractRoutingDataSource 实现 创建 AbstractRoutingDataSource 实现类,负责保存所有数据源与切换数据源策略:public ...
- Zend Studio 安装破解和汉化
1.下载文件. 2.默认安装Zend Studio. 3.替换安装目录下plugins下的com.zend.verifier_12.5.1.v20150514-2003.jar文件 4.打开Zend ...
- Andfix热修复技术使用
AndFix,全称是Android hot-fix.是阿里开源的一个Android热补丁框架,允许APP在不重新发版本的情况下修复线上的bug.支持Android 2.3 到 6.0. andfix的 ...
- java web 项目启动的根目录,以及项目启动后使用的端口具体是哪一个
1.今天启动项目发现一直找不到网页,原来是自己浏览器地址的根目录出现了问题,那么系统中的根目录(也就是项目名)到底是哪个,究竟以哪个为基准? 这里有一地方不能忽视:见图片 在普通的java web项目 ...
- Windows下VM安装MacOS
我们在使用Windows操作系统的情况下,不去买苹果电脑,想去玩玩Mac苹果操作系统,有两种选择,一种就是安装黑苹果(就是在非苹果电脑上安装MacOS)这种方式不推荐,因为你会遇到很多很多不兼容问题, ...
- Metronic-最优秀的基于Bootstrap的响应式网站模版
在所有我看到过的基于Bootstrap的网站模版中,Metronic是我认为最优秀的,其外观之友好.功能之全面让人惊叹.Metronic 是一个自适应的HTML模版,提供后台管理模版和前端内容网页模版 ...