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 相关文章推荐
根据鼠标的位置动态的控制层的位置
Nov 24 Javascript
jQuery中使用data()方法读取HTML5自定义属性data-*实例
Apr 11 Javascript
原生js事件的添加和删除的封装
Jul 01 Javascript
详解JavaScript中常用的函数类型
Nov 18 Javascript
微信小程序模板之分页滑动栏
Feb 10 Javascript
jQuery中Chosen三级联动功能实例代码
Mar 07 Javascript
jQueryeasyui 中如何使用datetimebox 取两个日期间相隔的天数
Jun 13 jQuery
Javascript 严格模式use strict详解
Sep 16 Javascript
JS运动特效之任意值添加运动的方法分析
Jan 24 Javascript
vue添加axios,并且指定baseurl的方法
Sep 19 Javascript
微信小程序扫描二维码获取信息实例详解
May 07 Javascript
js实现轮播图特效
May 28 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扩展” 的解决方法
2007/04/16 PHP
php绘图中显示不出图片的原因及解决
2014/03/05 PHP
ThinkPHP中的系统常量和预定义常量集合
2014/07/01 PHP
PHP切割汉字的常用方法实例总结
2019/04/27 PHP
js 操作css实现代码
2009/06/11 Javascript
6款新颖的jQuery和CSS3进度条插件推荐
2013/03/05 Javascript
jquery struts 验证唯一标识(公用方法)
2013/03/27 Javascript
js单例模式详解实例
2013/11/21 Javascript
jQuery ui 利用 datepicker插件实现开始日期(minDate)和结束日期(maxDate)
2014/05/22 Javascript
DEDECMS如何为文章添加HOT NEW标志图片
2015/08/14 Javascript
js制作带有遮罩弹出层实现登录注册表单特效代码分享
2015/09/05 Javascript
封装属于自己的JS组件
2016/01/27 Javascript
Bootstrap Validator 表单验证
2016/07/25 Javascript
微信小程序 window_x64环境搭建
2016/09/30 Javascript
微信公众号开发 自定义菜单跳转页面并获取用户信息实例详解
2016/12/08 Javascript
基于Nodejs利用socket.io实现多人聊天室
2017/02/22 NodeJs
jQuery选择器选中最后一个元素,倒数第二个元素操作示例
2018/12/10 jQuery
轻松解决JavaScript定时器越走越快的问题
2019/05/13 Javascript
vue中实现点击按钮滚动到页面对应位置的方法(使用c3平滑属性实现)
2019/12/29 Javascript
python获取局域网占带宽最大3个ip的方法
2015/07/09 Python
python3调用百度翻译API实现实时翻译
2018/08/16 Python
Python模拟简单电梯调度算法示例
2018/08/20 Python
Python3模拟登录操作实例分析
2019/03/12 Python
ZABBIX3.2使用python脚本实现监控报表的方法
2019/07/02 Python
Python进度条的制作代码实例
2019/08/31 Python
python爬虫爬取监控教务系统的思路详解
2020/01/08 Python
Pytorch 定义MyDatasets实现多通道分别输入不同数据方式
2020/01/15 Python
Python自动巡检H3C交换机实现过程解析
2020/08/14 Python
python字典通过值反查键的实现(简洁写法)
2020/09/30 Python
全球游戏Keys和卡片市场:GamesDeal
2018/03/28 全球购物
学校课外活动总结
2014/05/08 职场文书
五五普法心得体会
2014/09/04 职场文书
2015年售后服务工作总结
2015/04/25 职场文书
2015年小学教导处工作总结
2015/05/26 职场文书
Mysql效率优化定位较低sql的两种方式
2021/05/26 MySQL
windows server2008 开启端口的实现方法
2022/06/25 Servers