js最全的数组的降维5种办法(小结)


Posted in Javascript onApril 28, 2020

业务开发中,二维数组、多维数组转为一维数组这种需求是少不了的,有些多维数组里面可能嵌套会更深,数组降维就是来解决此问题的

1、数组字符串化

let arr = [[222, 333, 444], [55, 66, 77], {a: 1} ]
arr += '';
arr = arr.split(',');
 
console.log(arr); // ["222", "333", "444", "55", "66", "77", "[object Object]"]

所有的元素会转换为字符串,且元素为对象类型会被转换为 "[object Object]" ,对于同一种类型数字或字符串还是可以的。

2、递归

function reduceDimension(arr){
  let ret = [];
  let toArr = function(arr){
    arr.forEach(function(item){
      item instanceof Array ? toArr(item) : ret.push(item);
    });
  }
  toArr(arr);
  return ret;
}

3、Array​.prototype​.flat()

var arr1 = [1, 2, [3, 4]];
arr1.flat(); 
// [1, 2, 3, 4]
 
var arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]
 
var arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]
 
//使用 Infinity 作为深度,展开任意深度的嵌套数组
arr3.flat(Infinity); 
// [1, 2, 3, 4, 5, 6]

4、

// 不使用递归,使用 stack 无限反嵌套多层嵌套数组
var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];
function flatten(input) {
 const stack = [...input];
 const res = [];
 while (stack.length) {
  // 使用 pop 从 stack 中取出并移除值
  const next = stack.pop();
  if (Array.isArray(next)) {
   // 使用 push 送回内层数组中的元素,不会改动原始输入 original input
   stack.push(...next);
  } else {
   res.push(next);
  }
 }
 // 使用 reverse 恢复原数组的顺序
 return res.reverse();
}
flatten(arr1);// [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]

5、

// 使用 reduce、concat 和递归无限反嵌套多层嵌套的数组
var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];
 
function flattenDeep(arr1) {
  return arr1.reduce((acc, val) => Array.isArray(val) ? acc.concat(flattenDeep(val)) : acc.concat(val), []);
}
flattenDeep(arr1);
// [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]

到此这篇关于js最全的数组的降维5种办法(小结)的文章就介绍到这了,更多相关js 数组降维内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
Javascript模块化编程(一)AMD规范(规范使用模块)
Jan 17 Javascript
JS验证邮箱格式是否正确的代码
Dec 05 Javascript
实现js保留小数点后N位的代码
Nov 13 Javascript
js表单提交和submit提交的区别实例分析
Dec 10 Javascript
javascript截图 jQuery插件imgAreaSelect使用详解
May 04 Javascript
Javascript数组中push方法用法分析
Oct 31 Javascript
Angular2入门教程之模块和组件详解
May 28 Javascript
JS去掉字符串前后空格、阻止表单提交的实现代码
Jun 08 Javascript
微信小程序实现action-sheet弹出底部菜单功能【附源码下载】
Dec 09 Javascript
jQuery EasyUI 选项卡面板tabs的使用实例讲解
Dec 25 jQuery
讲解vue-router之命名路由和命名视图
May 28 Javascript
全网小程序接口请求封装实例代码
Nov 06 Javascript
JS数组降维的实现Array.prototype.concat.apply([], arr)
Apr 28 #Javascript
React中Ref 的使用方法详解
Apr 28 #Javascript
在Webpack中用url-loader处理图片和字体的问题
Apr 28 #Javascript
react PropTypes校验传递的值操作示例
Apr 28 #Javascript
vue 百度地图(vue-baidu-map)绘制方向箭头折线实例代码详解
Apr 28 #Javascript
Vue + Scss 动态切换主题颜色实现换肤的示例代码
Apr 27 #Javascript
浅析vue cli3 封装Svgicon组件正确姿势(推荐)
Apr 27 #Javascript
You might like
Thinkphp的volist标签嵌套循环使用教程
2014/07/08 PHP
ThinkPHP连接数据库的方式汇总
2014/12/05 PHP
linux下php上传文件注意事项
2016/06/11 PHP
Yii2 ActiveRecord多表关联及多表关联搜索的实现
2016/06/30 PHP
Yii2.0表关联查询实例分析
2016/07/18 PHP
mysql查找删除重复数据并只保留一条实例详解
2016/09/24 PHP
yii2简单使用less代替css示例
2017/03/10 PHP
php数组函数array_push()、array_pop()及array_shift()简单用法示例
2020/01/26 PHP
从JavaScript的函数重名看其初始化方式
2007/03/08 Javascript
模仿JQuery sortable效果 代码有错但值得看看
2009/11/05 Javascript
js获取url中指定参数值的示例代码
2013/12/14 Javascript
页面装载js及性能分析方法介绍
2014/03/21 Javascript
浅谈jquery回调函数callback的使用
2015/01/30 Javascript
JavaScript判断undefined类型的正确方法
2015/06/30 Javascript
使用jspdf生成pdf报表
2015/07/03 Javascript
jQuery animate和CSS3相结合实现缓动追逐效果附源码下载
2016/04/18 Javascript
前端学习笔记style,currentStyle,getComputedStyle的用法与区别
2016/05/28 Javascript
简单实现js间歇或无缝滚动效果
2016/06/29 Javascript
js编写的treeview使用方法
2016/11/11 Javascript
jQuery实现背景滑动菜单
2016/12/02 Javascript
求js数组的最大值和最小值的四种方法
2017/03/03 Javascript
Javascript es7中比较实用的两个方法示例
2017/07/21 Javascript
Vue中对拿到的数据进行A-Z排序的实例
2018/09/25 Javascript
JavaScript常见继承模式实例小结
2019/01/11 Javascript
解决layer.msg 不居中 ifram中的问题
2019/09/05 Javascript
原生JavaScript实现进度条
2021/02/19 Javascript
[52:27]2018DOTA2亚洲邀请赛 3.31 小组赛B组 paiN vs Secret
2018/04/01 DOTA
Python实现网站文件的全备份和差异备份
2014/11/30 Python
Python Requests库基本用法示例
2018/08/20 Python
Python实现 PS 图像调整中的亮度调整
2019/06/28 Python
行政专员工作职责
2013/12/22 职场文书
2014年销售工作总结与计划
2014/12/01 职场文书
聘任协议书(挂靠)
2015/09/21 职场文书
Python带你从浅入深探究Tuple(基础篇)
2021/05/15 Python
用Python进行栅格数据的分区统计和批量提取
2021/05/27 Python
MySQL 开窗函数
2022/02/15 MySQL