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 相关文章推荐
slice函数的用法 之不错的应用
Dec 29 Javascript
js getElementsByTagName的简写方式
Jun 27 Javascript
自写的一个jQuery圆角插件
Oct 26 Javascript
JavaScript获取页面上被选中文字的方法技巧
Mar 13 Javascript
15个常用的jquery代码片段
Dec 19 Javascript
bootstrap实现每隔5秒自动轮播效果
Dec 20 Javascript
canvas实现图像放大镜
Feb 06 Javascript
基于Bootstrap分页的实例讲解(必看篇)
Jul 04 Javascript
vue js秒转天数小时分钟秒的实例代码
Aug 08 Javascript
Node.js npm命令运行node.js脚本的方法
Oct 10 Javascript
Angular利用HTTP POST下载流文件的步骤记录
Jul 26 Javascript
详解三种方式在React中解决绑定this的作用域问题并传参
Aug 18 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
基于mysql的论坛(3)
2006/10/09 PHP
php中将地址生成迅雷快车旋风链接的代码[测试通过]
2011/04/20 PHP
鸡肋的PHP单例模式应用详解
2013/06/03 PHP
PHP使用函数用法详解
2018/09/30 PHP
设定php简写功能的方法
2019/11/28 PHP
Javascript浅谈之引用类型
2013/12/18 Javascript
asp.net+js实现金额格式化
2015/02/27 Javascript
深入理解JavaScript定时机制
2016/10/27 Javascript
基于jQuery实现表格的排序
2016/12/02 Javascript
Vue插件写、用详解(附demo)
2017/03/20 Javascript
80%应聘者都不及格的JS面试题
2017/03/21 Javascript
详解vue前后台数据交互vue-resource文档
2017/07/19 Javascript
利用hasOwnProperty给数组去重的面试题分享
2018/11/05 Javascript
nodejs实现用户登录路由功能
2019/05/22 NodeJs
20多个小事例带你重温ES10新特性(小结)
2019/09/29 Javascript
浅析Vue 中的 render 函数
2020/02/28 Javascript
vue render函数动态加载img的src路径操作
2020/10/26 Javascript
微信小程序实现单个或多个倒计时功能
2020/11/01 Javascript
[01:27]DOTA2电竞之夜 今夜共饮庆功酒
2014/08/02 DOTA
python中getaddrinfo()基本用法实例分析
2015/06/28 Python
Linux中Python 环境软件包安装步骤
2016/03/31 Python
python解决网站的反爬虫策略总结
2016/10/26 Python
python如何实现一个刷网页小程序
2018/11/27 Python
python如何调用php文件中的函数详解
2020/12/29 Python
Python爬虫入门教程01之爬取豆瓣Top电影
2021/01/24 Python
聊聊python在linux下与windows下导入模块的区别说明
2021/03/03 Python
捷克母婴用品购物网站:Feedo.cz
2020/12/28 全球购物
如何删除一个表里面的重复行
2013/07/13 面试题
授权委托书样本
2014/09/25 职场文书
民事诉讼代理授权委托书
2014/10/11 职场文书
优秀校长事迹材料
2014/12/24 职场文书
公司承诺函范文
2015/01/21 职场文书
2015年乡镇工作总结范文
2015/04/22 职场文书
《只有一个地球》教学反思
2016/02/16 职场文书
[有人@你]你有一封绿色倡议书,请查收!
2019/07/18 职场文书
六年级作文之家庭作文
2019/12/12 职场文书