JS数组扁平化(flat)方法总结详解


Posted in Javascript onJune 24, 2019

需求:多维数组=>一维数组

let ary = [1, [2, [3, [4, 5]]], 6];
let str = JSON.stringify(ary);

第0种处理:直接的调用

arr_flat = arr.flat(Infinity);

第一种处理

ary = str.replace(/(\[\]))/g, '').split(',');

第二种处理

str = str.replace(/(\[\]))/g, '');
str = '[' + str + ']';
ary = JSON.parse(str);

第三种处理:递归处理

let result = [];
let fn = function(ary) {
for(let i = 0; i < ary.length; i++) }{
let item = ary[i];
if (Array.isArray(ary[i])){
fn(item);
} else {
result.push(item);
}
}
}

第四种处理:用 reduce 实现数组的 flat 方法

function flatten(ary) {
return ary.reduce((pre, cur) => {
return pre.concat(Array.isArray(cur) ? flatten(cur) : cur);
})
}
let ary = [1, 2, [3, 4], [5, [6, 7]]]
console.log(ary.MyFlat(Infinity))

第五种处理:扩展运算符

while (ary.some(Array.isArray)) {
ary = [].concat(...ary);
}

这是一个比较实用而且很容易被问到的问题,欢迎大家交流补充。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript事件问题
Sep 05 Javascript
Jquery 高亮显示文本中重要的关键字
Dec 24 Javascript
JS设置获取cookies的方法
Jan 26 Javascript
javascript中使用正则计算中文长度的例子
Apr 29 Javascript
jQuery实现复选框全选/取消全选/反选及获得选择的值
Jun 12 Javascript
详谈Angular 2+ 的表单(一)之模板驱动型表单
Apr 25 Javascript
详解EasyUi控件中的Datagrid
Aug 23 Javascript
基于jquery.page.js实现分页效果
Jan 01 jQuery
详解Webpack loader 之 file-loader
Nov 07 Javascript
详解Element 指令clickoutside源码分析
Feb 15 Javascript
ES6的异步操作之promise用法和async函数的具体使用
Dec 06 Javascript
小程序实现左滑删除的效果的实例代码
Oct 19 Javascript
深入了解query和params的使用区别
Jun 24 #Javascript
如何使用JavaScript实现栈与队列
Jun 24 #Javascript
简单了解JavaScript中的执行上下文和堆栈
Jun 24 #Javascript
一次让你了解全部JavaScript的作用域
Jun 24 #Javascript
通过循环优化 JavaScript 程序
Jun 24 #Javascript
在React中写一个Animation组件为组件进入和离开加上动画/过度效果
Jun 24 #Javascript
node中实现删除目录的几种方法
Jun 24 #Javascript
You might like
详解在PHP的Yii框架中使用行为Behaviors的方法
2016/03/18 PHP
PHP中SERIALIZE和JSON的序列化与反序列化操作区别分析
2016/10/11 PHP
Laravel框架实现利用监听器进行sql语句记录功能
2018/06/06 PHP
推荐:极酷右键菜单
2006/11/29 Javascript
JavaScript 编程引入命名空间的方法
2007/06/29 Javascript
js select常用操作控制代码
2010/03/16 Javascript
js URL参数的拼接方法比较
2012/02/15 Javascript
页面右下角弹出提示框示例代码js版
2013/08/02 Javascript
js数组的五种迭代方法及两种归并方法(推荐)
2016/06/14 Javascript
AngularJS Toaster使用详解
2017/02/24 Javascript
vue父组件点击触发子组件事件的实例讲解
2018/02/08 Javascript
angular5 httpclient的示例实战
2018/03/12 Javascript
如何更好的编写js async函数
2018/05/13 Javascript
SVG实现时钟效果
2018/07/17 Javascript
小程序云开发如何实现图片上传及发表文字
2019/05/17 Javascript
Vue中使用matomo进行访问流量统计的实现
2019/11/05 Javascript
javascript设计模式 ? 中介者模式原理与用法实例分析
2020/04/20 Javascript
[04:56]经典回顾:前Ehome 与 前LGD
2015/02/26 DOTA
从零学Python之入门(二)基本数据类型
2014/05/25 Python
利用Python中的输入和输出功能进行读取和写入的教程
2015/04/14 Python
六个窍门助你提高Python运行效率
2015/06/09 Python
详解Python装饰器由浅入深
2016/12/09 Python
python实现图书馆研习室自动预约功能
2018/04/27 Python
python实现C4.5决策树算法
2018/08/29 Python
pycharm 在windows上编辑代码用linux执行配置的方法
2018/10/27 Python
python调用接口的4种方式代码实例
2019/11/19 Python
python opencv实现简易画图板
2020/08/27 Python
如何利用python正则表达式匹配版本信息
2020/12/09 Python
中国综合网上购物商城:苏宁易购
2016/08/09 全球购物
什么是SQL Server的确定性函数和不确定性函数
2016/08/04 面试题
linux面试题参考答案(5)
2016/11/05 面试题
旺仔牛奶广告词
2014/03/20 职场文书
八一建军节演讲稿
2014/09/10 职场文书
“四风”查摆问题自我剖析材料
2014/09/27 职场文书
办公室务虚会发言材料
2014/10/20 职场文书
2014年扶贫帮困工作总结
2014/12/09 职场文书