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 相关文章推荐
关于IE、Firefox、Opera页面呈现异同 写脚本很痛苦
Aug 28 Javascript
XHTML下,JS浮动代码失效的问题
Nov 12 Javascript
js判断鼠标同时离开两个div的思路及代码
May 31 Javascript
JS关闭窗口时产生的事件及用法示例
Aug 20 Javascript
JavaScript制作颜色反转小游戏
Sep 25 Javascript
微信小程序 欢迎界面开发的实例详解
Nov 30 Javascript
使用JavaScript判断用户输入的是否为正整数(两种方法)
Feb 05 Javascript
BootStrap 弹出层代码
Feb 09 Javascript
使用Angular CLI进行Build(构建)和Serve详解
Mar 24 Javascript
如何从零开始利用js手写一个Promise库详解
Apr 19 Javascript
jquery获取select选中值的文本,并赋值给另一个输入框的方法
Aug 21 jQuery
详解element-ui动态限定的日期范围选择器代码片段
Jul 03 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+mysql查询优化简单实例
2015/01/13 PHP
php实现比较全的数据库操作类
2015/06/18 PHP
PHP魔术方法使用方法汇总
2016/02/14 PHP
php简单解析mysqli查询结果的方法(2种方法)
2016/06/29 PHP
可以显示单图片,多图片ajax请求的ThickBox3.1类下载
2007/12/23 Javascript
JQuery AJAX实现目录浏览与编辑的代码
2008/10/21 Javascript
ExtJs Excel导出并下载IIS服务器端遇到的问题
2011/09/16 Javascript
JavaScript获取和设置CheckBox状态的简单方法
2013/07/05 Javascript
对Jquery中的ajax再封装,简化操作示例
2014/02/12 Javascript
JavaScript中的console.time()函数详细介绍
2014/12/29 Javascript
详解AngularJS中$http缓存以及处理多个$http请求的方法
2016/02/06 Javascript
详解vue事件对象、冒泡、阻止默认行为
2017/03/20 Javascript
vuex的使用及持久化state的方式详解
2018/01/23 Javascript
详解vue.js下引入百度地图jsApi的两种方法
2018/07/27 Javascript
深入学习TypeScript 、React、 Redux和Ant-Design的最佳实践
2019/06/17 Javascript
vue页面加载时的进度条功能(实例代码)
2020/01/13 Javascript
[59:26]DOTA2上海特级锦标赛D组资格赛#1 EG VS VP第二局
2016/02/28 DOTA
Fabric 应用案例
2016/08/28 Python
Python2.X/Python3.X中urllib库区别讲解
2017/12/19 Python
Python实现重建二叉树的三种方法详解
2018/06/23 Python
Python 新建文件夹与复制文件夹内所有内容的方法
2018/10/27 Python
Python实现KNN(K-近邻)算法的示例代码
2019/03/05 Python
python编写微信公众号首图思路详解
2019/12/13 Python
pandas 按日期范围筛选数据的实现
2021/02/20 Python
使用CSS3设计地图上的雷达定位提示效果
2016/04/05 HTML / CSS
Quiksilver荷兰官方网站:冲浪和滑雪板
2019/11/16 全球购物
AJAX检测用户名是否存在的方法
2021/03/24 Javascript
中专生学习生活的自我评价分享
2013/10/27 职场文书
竞选演讲稿范文
2013/12/28 职场文书
视光学毕业生自荐书范文
2014/02/13 职场文书
小学语文教学经验交流材料
2014/06/02 职场文书
公司年底活动方案
2014/08/17 职场文书
纪律教育学习月活动总结
2014/08/27 职场文书
中学生国庆节演讲稿2015
2015/07/30 职场文书
学校少先队工作总结
2015/08/12 职场文书
退休劳动合同怎么写?
2019/10/25 职场文书