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操作cookie的文章(设置,删除cookies)
Apr 01 Javascript
模拟select的代码
Oct 19 Javascript
javascript封装 Cookie 应用接口
Aug 07 Javascript
BootStrap中按钮点击后被禁用按钮的最佳实现方法
Sep 23 Javascript
Bootstrap Table使用心得总结
Nov 29 Javascript
获取select的value、text值的简单示例(jquery与javascript)
Dec 07 Javascript
详解用JS添加和删除class类名
Mar 25 Javascript
多个vue子路由文件自动化合并的方法
Sep 03 Javascript
layui实现下拉复选功能的例子(包括数据的回显与上传)
Sep 24 Javascript
element-ui 文件上传修改文件名的方法示例
Nov 05 Javascript
vue+element_ui上传文件,并传递额外参数操作
Dec 05 Vue.js
Vue OpenLayer 为地图绘制风场效果
Apr 24 Vue.js
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
默默小谈PHP&MYSQL分页原理及实现
2007/01/02 PHP
PHP版 汉字转码的实现详解
2013/06/09 PHP
php从数组中随机选择若干不重复元素的方法
2015/03/14 PHP
php保存信息到当前Session的方法
2015/03/16 PHP
PHP文件缓存类实现代码
2015/10/26 PHP
php中str_pad()函数用法分析
2017/03/28 PHP
php apache开启跨域模式过程详解
2019/07/08 PHP
js 绑定带参数的事件以及手动触发事件
2010/04/27 Javascript
JS判断当前日期是否大于某个日期的实现代码
2012/09/02 Javascript
jquery多行滚动/向左或向上滚动/响应鼠标实现思路及代码
2013/01/23 Javascript
Function.prototype.call.apply结合用法分析示例
2013/07/03 Javascript
封装了jQuery的Ajax请求全局配置
2015/02/05 Javascript
基于JS实现新闻列表无缝向上滚动实例代码
2016/01/22 Javascript
前端弹出对话框 js实现ajax交互
2016/09/09 Javascript
javascript中对象的定义、使用以及对象和原型链操作小结
2016/12/14 Javascript
简单实现JS倒计时效果
2016/12/23 Javascript
详解Vue 非父子组件通信方法(非Vuex)
2017/05/24 Javascript
解决VUE框架 导致绑定事件的阻止冒泡失效问题
2018/02/24 Javascript
解决Layui 表单提交数据为空的问题
2018/08/15 Javascript
如何用RxJS实现Redux Form
2018/12/29 Javascript
javascript实现前端成语点击验证
2020/06/24 Javascript
[01:08:00]Fnatic vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
在Python中操作字符串之replace()方法的使用
2015/05/19 Python
Python XlsxWriter模块Chart类用法实例分析
2019/03/11 Python
django用户登录验证的完整示例代码
2019/07/21 Python
查看keras各种网络结构各层的名字方式
2020/06/11 Python
Elasticsearch py客户端库安装及使用方法解析
2020/09/14 Python
用pip给python安装matplotlib库的详细教程
2021/02/24 Python
纯CSS实现右侧底部悬浮效果(悬浮QQ、微信、微博、邮箱等联系方式)
2015/04/24 HTML / CSS
乌克兰时尚鞋子和衣服购物网站:Born2be
2018/05/24 全球购物
ECHT官方网站:男女健身服
2020/02/14 全球购物
英文导游欢迎词
2014/01/11 职场文书
民主生活会主持词
2015/07/01 职场文书
2016年优秀党务工作者先进事迹材料
2016/02/29 职场文书
《西游记》读后感(3篇)
2019/09/20 职场文书
mysql联合索引的使用规则
2021/06/23 MySQL