数组扁平化,就是将多维数组碾平为一维数组,方便使用。

一:例如,一个二维数组 var arr = ['a', ['b', 2], ['c', 3, 'x']],将其扁平化:

1.  通过 apply 借用数组的 concat 方法:

[].concat.apply([], arr);

结果如下:

jQuery 中的 map 方法就用到了这个技巧。

但如果直接调用 concat 方法,[].concat(arr),就没有扁平化效果。

2扩展运算符...

[].concat(...arr)

3. reduce(ES5新增的数组方法):

[['a'], ['b', 2], ['c', 3, 'x']].reduce((a, b) => a.concat(b), []);

二:对于三维及以上的数组:

1. 数组每一项都是简单类型,如数字:

var arr = [[1], [[2, 3], [4]], 5, 6];
arr.toString().split(',').map(item => +item);

2. 递归:

 var flatten = function(arr) {
var isArray = function(arr) {
return Array.isArray(arr) || Object.prototype.toString.call(arr) === '[object Array]';
},
ret = [],
item; if (!isArray(arr)) {
return;
} for (var i = 0; i < arr.length; i++) {
item = arr[i];
if (isArray(item)) {
ret = ret.concat(flatten(item));
} else {
ret.push(item);
}
} return ret;
}; flatten( [ 'a', [[[['b', 2]]]], ['c', [3, 'x']] ] );

该方法对任意维数组都有效。

三:flat (ES6方法)

flat(Infinity) 可将任意维数组转成一维数组

js多维数组扁平化的更多相关文章

  1. js中数组扁平化处理

  2. js实现数组扁平化

    数组扁平化的方式 什么是数组扁平化? 数组扁平化:指将一个多维数组转化为一个一维数组. 例:将下面数组扁平化处理. const arr = [1, [2, 3, [4, 5]]] // ---> ...

  3. JavaScript数组常用方法解析和深层次js数组扁平化

    前言 数组作为在开发中常用的集合,除了for循环遍历以外,还有很多内置对象的方法,包括map,以及数组筛选元素filter等. 注:文章结尾处附深层次数组扁平化方法操作. 作为引用数据类型的一种,在处 ...

  4. JS: 数组扁平化

    数组扁平化 什么是数组扁平化? 数组扁平化就是将一个多层嵌套的数组 (Arrary) 转化为只有一层. // 多层嵌套 [1, 2, [3, 4]] // 一层 [1, 2, 3, 4] 递归实现 思 ...

  5. js技巧-使用reduce实现更简洁的数组对象去重和数组扁平化

    Array.prototype.reduce()方法介绍: 感性认识reduce累加器: const arr = [1, 2, 3, 4]; const reducer = (accumulator, ...

  6. JS数组专题1️⃣ ➖ 数组扁平化

    一.什么是数组扁平化 扁平化,顾名思义就是减少复杂性装饰,使其事物本身更简洁.简单,突出主题. 数组扁平化,对着上面意思套也知道了,就是将一个复杂的嵌套多层的数组,一层一层的转化为层级较少或者只有一层 ...

  7. javascrip的数组扁平化

    扁平化 数组的扁平化,就是将一个嵌套多层的数组 array (嵌套可以是任何层数)转换为只有一层的数组. 举个例子,假设有个名为 flatten 的函数可以做到数组扁平化,效果就会如下: var ar ...

  8. js 二维数组 for 循环重新赋值

    javascript 二维数组的重新 组装 var arr = [[1,2],[3,4],[5,6],[7,8]]; var temp = new Array(); for(var i= 0 ;i&l ...

  9. js二维数组定义和初始化的三种方法总结

    js二维数组定义和初始化的三种方法总结 方法一:直接定义并且初始化,这种遇到数量少的情况可以用var _TheArray = [["0-1","0-2"],[& ...

随机推荐

  1. 大数据系列文章-Hadoop的HDFS读写流程(二)

    在介绍HDFS读写流程时,先介绍下Block副本放置策略. Block副本放置策略 第一个副本:放置在上传文件的DataNode:如果是集群外提交,则随机挑选一台磁盘不太满,CPU不太忙的节点. 第二 ...

  2. 搜狗输入法ubuntu

    1.下载搜狗输入法的安装包 下载地址为:http://pinyin.sogou.com/linux/ ,如下图,要选择与自己系统位数一致的安装包,我的系统是64位,所以我下载64位的安装包 2.按键C ...

  3. inline-block元素水平居中问题

    今天做项目的时候碰到了不固定元素个数,需要水平居中的问题,原来的确定宽度下margin:0 auto等方法木有用了.想起来之前看过display:inline-block的文章, 果断用这个. 之前很 ...

  4. 使用Ctex中遇到的一些问题

    一般下载好Ctex,我是使用Latex+dvi2pdf完成编译的,但是发现推荐的使用为:1)运行CCT & Latex命令生成两次dvi和ps文件 2)使用dvi2pdf编译dvi文件生成pd ...

  5. UvaLive6441(期望概率dp)

    1.涉及负数时同时维护最大和最小,互相转移. 2.考场上最大最小混搭转移WA,赛后发现如果是小的搭小的,大的搭大的就可过,类似这种: db a = (C[i] - W[i]) * dp1[i - ][ ...

  6. Windows下降权MYSQL和apche的运行级别(普通用户权限运行)

    1.MYSQL的降权运行  新建立一个用户比如mysql  net user mysql microsoft /add  net localgroup users mysql /del  不属于任何组 ...

  7. archsummit_bj2016

    http://bj2016.archsummit.com/schedule 大会日程 2016年12月02日,星期五 7:45-9:00 签到 8:45-9:00 开始入场 9:00-9:30 开场致 ...

  8. 开发原生安卓cordova插件(基础)

    cordova应用如果需要调用原生安卓接口,方法是使用cordova插件,cordova官方提供了主流原生功能的插件,但如果还不能满足需求,也可以自己开发cordova插件 以下介绍开发一个最简单的插 ...

  9. Cognos邮件发送

    1.打开报表,点击下图的标记 2.设置发送格式收件人 3.设置报表格式 4.设置发送内容

  10. MFC技术积累——基于MFC对话框类的那些事儿5

    4. 菜单 4.1 弹出菜单 本节主要讲解如何在主对话框的指定区域内通过鼠标右击来弹出一个菜单选项.最终效果图如图4.1. 如图4.1鼠标只能在指定区域(图中深色区域)内右击时弹出菜单,在指定区域外点 ...