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字典探测用户名工具
Oct 05 Javascript
40个有创意的jQuery图片和内容滑动及弹出插件收藏集之三
Jan 03 Javascript
jQuery实现文本框输入同步的方法
Jun 20 Javascript
AngularJS实现元素显示和隐藏的几个案例
Dec 09 Javascript
JavaScript实现简单Tip提示框效果
Apr 20 Javascript
js判断某个字符出现的次数的简单实例
Jun 03 Javascript
关于在Servelet中如何获取当前时间的操作方法
Jun 28 Javascript
js html css实现复选框全选与反选
Oct 09 Javascript
解决vue项目报错webpackJsonp is not defined问题
Mar 14 Javascript
浅谈layui里的上传控件问题
Sep 26 Javascript
详解node登录接口之密码错误限制次数(含代码)
Oct 25 Javascript
原生JavaScript之es6中Class的用法分析
Feb 23 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录入页面中动态从数据库中提取数据的实现
2006/10/09 PHP
php创建和删除目录函数介绍和递归删除目录函数分享
2014/11/18 PHP
PHP模板引擎Smarty中变量的使用方法示例
2016/04/11 PHP
/etc/php-fpm.d/www.conf 配置注意事项
2017/02/04 PHP
php文件包含的几种方式总结
2019/09/19 PHP
js+css实现增加表单可用性之提示文字
2013/06/03 Javascript
JavaScript加强之自定义callback示例
2013/09/21 Javascript
使用Browserify配合jQuery进行编程的超级指南
2015/07/28 Javascript
React.js入门实例教程之创建hello world 的5种方式
2016/05/11 Javascript
jQuery获取table行数并输出单元格内容的实现方法
2016/06/30 Javascript
wap手机端解决返回上一页的js实例
2016/12/08 Javascript
基于jQuery实现弹幕APP
2017/02/10 Javascript
Angular2.js实现表单验证详解
2017/06/23 Javascript
layer子层给父层页面元素赋值,以达到向父层页面传值的效果实例
2017/09/22 Javascript
Vue核心概念Getter的使用方法
2019/01/18 Javascript
EasyUI 数据表格datagrid列自适应内容宽度的实现
2019/07/18 Javascript
Vue-CLI与Vuex使用方法实例分析
2020/01/06 Javascript
JavaScript异步操作的几种常见处理方法实例总结
2020/05/11 Javascript
对于Python的Django框架部署的一些建议
2015/04/09 Python
使用Python解析JSON数据的基本方法
2015/10/15 Python
详解Python中的array数组模块相关使用
2016/07/05 Python
Python 网络爬虫--关于简单的模拟登录实例讲解
2018/06/01 Python
pip install urllib2不能安装的解决方法
2018/06/12 Python
Python使用pyodbc访问数据库操作方法详解
2018/07/05 Python
Windows下python3.6.4安装教程
2018/07/31 Python
在Tensorflow中实现梯度下降法更新参数值
2020/01/23 Python
python中count函数简单的实例讲解
2020/02/06 Python
Python requests模块基础使用方法实例及高级应用(自动登陆,抓取网页源码)实例详解
2020/02/14 Python
Napapijri西班牙在线商店:夹克、外套、运动衫等
2020/11/05 全球购物
公司综合部的成员自我评价分享
2013/11/05 职场文书
管理专员自荐信
2014/01/26 职场文书
2015年妇幼卫生工作总结
2015/05/23 职场文书
幼儿园庆六一主持词
2015/06/30 职场文书
大学军训心得体会800字
2016/01/11 职场文书
2019公司管理制度
2019/04/19 职场文书
webpack介绍使用配置教程详解webpack介绍和使用
2022/06/25 Javascript