数组的扁平化:将多维数组变成一维数组

对于一个像这样的嵌套数组:a=[1,[2,[3,4]],5,6]我们想要把它变成一个一维数组,有下面几种方法:

方法一:递归一

function parseArr(arr,res){

var i=0;

for(i=0;i

if(arr[i] instanceof Array){

parseArr(arr[i],res);

}else{

res.push(arr[i]);

}

}

}

var a=[1,[2,[3,4]],5,6];

var res=[];

parseArr(a,res);

递归二(推荐)

var arr = ['mu','zi',['dig',['big','love']]]

function flatten(arr){

var res = [];

for(var i=0;i

if(Array.isArray(arr[i])){

res = res.concat(flatten(arr[i]));

}else{

res.push(arr[i]);

}

}

return res;

}

console.log(flatten(arr))//["mu", "zi", "dig", "big", "love"]

对上面的方法进行解析:

1.语法: Array.isArray(object);参数:object必需。要测试的对象。

返回值

如果 object 是数组,则为 true;否则为 false。 如果 object 参数不是对象,则返回 false。

2.push()与concat()的区别

1,push()是在原数组的基础上修改的,执行push()方法后原数组的值也会变,在原数组后面添加值;若操作concat()的是一个数组先把原数组的每个值复制到一个新/另的数组,然后在新/另数组上进行操作,所以不会改变原数组的值。

2,如果参数不是数组,不管参数个数有多少个,push()和concat()都会直接把参数添加到数组后;如果参数是一个数组,push()就会直接把数组添加到原数组后,而concat()会把数组里的值取出来添加到原数组后。

方法二: 使用toString先变成一个字符串再使用split变成一个字符串数组(数组中的每个元素是一个字符串),最后使用map方法将数组中的每个元素返回为非字符串。

//arr数组中的元素不能为字符串只能为数组

var newArr=arr.toString().split(',').map(function(ele){

return +ele;

});

console.log(newArr)

alert(typeof arr[0]); //number

方式三:使用toString()和split(',')方法

toString()

如果数组的元素都是数字,那么我们可以考虑使用 toString 方法,因为:

toString会将数组中的数以逗号形式结合起来。

toString()之后再split(',')转成数组,并将其转换回数字数组:

var arr = [1, [2, [3, 4],[5,[6],[7,8]]]];

var arrStr = arr.toString();

console.log(arrStr);//1,2,3,4,5,6,7,8

var strArr = arrStr.split(',');

console.log(strArr)//["1", "2", "3", "4", "5", "6", "7", "8"]

方式二和方式三  的场景只适用于数组内全部是数字的情况,因为中间是全部转换为字符串了。

方法四: 使用reduce和concat方法

Array.prototype.flatten=function(){

return this.reduce(function(prev, cur) {

var moreArr = [].concat(cur).some(Array.isArray); //判断cur是不是一个数组

return prev.concat(moreArr ? cur.flatten() : cur);

},[]);

};

var arr=a.flatten();

//合并二维数组

var twoArr = [['mu','zi'],['dig','big'],['lucky','jiji']];

var oneArr = twoArr.reduce(function(total,currentValue){

// console.log(total)

return total.concat(currentValue);

})

console.log(oneArr);//["mu", "zi", "dig", "big", "lucky", "jiji"]

reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。

reduce() 可以作为一个高阶函数,用于函数的 compose。

注意: reduce() 对于空数组是不会执行回调函数的。

var arr = [1,2,3,4,5,6,7,8,9,10]

var str = arr.reduce(function(prev,cur,index,arr){

return prev + cur ;

})

console.log(str)//55

方式五:es6扩展运算符

function flatten(arr){

while(arr.some(item=>Array.isArray(item)){

arr = [].concat(...arr);

}

return arr;

}

由于扩展运算符一次只能展开一层数组:

var arr = [1, [2, [3, 4]]];

console.log([].concat(...arr)); // [1, 2, [3, 4]]

因此考虑只要数组中还有数组,就使用扩展运算符展开一次。

若有不足请多多指教!希望给您带来帮助!

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对脚本之家的支持。如果你想了解更多相关内容请查看下面相关链接

php n维数组扁平化,js嵌套的数组扁平化:将多维数组变成一维数组以及push()与concat()区别的讲解...相关推荐

  1. 树形json扁平化,一维数组树状化,对象深拷贝,元素后插入新元素,格式或动态路由等常用js合集

    索引 一.在元素后面插入一个新的元素. 二.对象或者数组的深拷贝. 三.从服务器端获取到动态路由表的格式化. 四.json树形数据扁平化处理(变成一维数组) 五.一维数组转化为树状结构对象. 六.防抖 ...

  2. c语言一维数组转化为二维矩阵,js将一维数组转化为二维数组

    遇到的问题: 后端返回的是一组一维数组,但是需要展示的格式是二维数组,常见的场景举例:后台返回10个长度的数组,需要分成3个一组展示在banner上. 例:[1,2,3,4,5,6,7,8,9,10] ...

  3. oracle 一维数转二维数组,js将一维数组转化为二维数组

    遇到的问题: 后端返回的是一组一维数组,但是需要展示的格式是二维数组,常见的场景举例:后台返回10个长度的数组,需要分成3个一组展示在banner上. 例:[1,2,3,4,5,6,7,8,9,10] ...

  4. js 的一维数组,二维数组

    什么是数组 我们知道变量用来存储数据,一个变量只能存储一个内容.假设你想存储10个人的姓名或者存储20个人的数学成绩,就需要10个或20个变量来存储,如果需要存储更多数据,那就会变的更麻烦.我们用数组 ...

  5. c语言bool怎么用_C语言中的一维数组和二维数组什么?怎么用?

    C++| 匠心之作 从0到1入门学编程[免费]​yun.itheima.com C语言除了基本数据类型之外,还提供了构造类型的数据,构造类型的数据包括数组类型.结构体类型和共用体类型.下面我们详细介绍 ...

  6. [Swift]多维数组的表示和存储:N维数组映射到一维数组(一一对应)!

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ ➤微信公众号:山青咏芝(shanqingyongzhi) ➤博客园地址:山青咏芝(https://www.cnblog ...

  7. day06数组-一维数组二维数组

    数组:          数组到底是什么呢?有什么特点呢?通过上面的分析:我们可以得到如下两句话:                 1.数组是存储同一种数据类型多个元素的集合.也可以看成是一个容器. ...

  8. 二维数组,锯齿数组和集合 C# 一维数组、二维数组(矩形数组)、交错数组(锯齿数组)的使用 C# 数组、多维数组(矩形数组)、锯齿数组(交叉数组)...

    二维数组,锯齿数组和集合 一.二维数组 二维数组: 一维数组----豆角 二维数组----表格 定义: 1.一维数组: 数据类型[] 数组变量名 = new 数据类型[数组长度]; 数据类型[] 数组 ...

  9. php 数组降维,php 数组去重的方法参考(一维数组去重、二维数组去重)

    本文介绍下,对php数组去除重复的方法,包括一维数组的去重.二维数组的去重.有需要的朋友参考下. 首先,来看一维数组重复项的去除方法. 使用array_unique函数,例如: 输出结果: Array ...

最新文章

  1. win7系统怎么查看服务器IP地址,win7系统的ip地址在哪 小编教你怎么查看
  2. 关于Apache mod_rewrite的中文配置、使用和语法介绍(实现URL重写和防盗链功能)
  3. 讲解虚拟服务器的书_程序员不得不看的书
  4. 初识python之函数基础
  5. ExtJs 入门 [窗体:Window组件]
  6. Windows 下安装 Scala
  7. Github新安全措施:停止Git客户端账号密码登录的解决方案
  8. 在python中可以使用if作为变量名_变量,注释,缩进,细数Python优雅风 | Python基础连载(二)...
  9. linux mysql集群 备份与恢复,Linux下MySQL的备份和恢复
  10. 字典重复key的合并
  11. (原創) 有限狀態機FSM coding style整理 (SOC) (Verilog)
  12. 阿里P9:程序员的“青春饭”,从什么时候开始结束?
  13. proposal中文翻译_proposal是什么意思_ proposal的翻译_音标_读音_用法_例句_爱词霸在线词典...
  14. Vue项目启动时自动打开浏览器
  15. Vivado高速时钟差分走线布线
  16. android studio 微信登录界面,如何使用Android Studio开发用户登录界面
  17. Java就业方向有哪些?学习Java开发能做什么?
  18. Java中为按钮添加监听器(事件处理)四种形式总结
  19. vulnhub-ted靶场
  20. kingcms php,KingCMS php版网站标签模版制作教程(二)

热门文章

  1. 填充磁盘空间的工具和方法
  2. Ubuntu12.04安装Mac OSX Yosemite
  3. pku 2031 Building a Space Station 最小生成树+精度控制
  4. eclipse 启动 找不到 JRE JDK的解决方法
  5. postgreSQL的应用
  6. golang for循环 使用多个变量
  7. web 点击劫持 X-Frame-Options
  8. golang 时间原点 时间日期格式化
  9. easyui 去掉按钮 虚线框
  10. kcp 协议分析 基于udp的可靠协议