JavaScript数组的扁平化：将 2D JavaScript 二维数组转换为 1D 一维数组（多种方法）

方法：

解决方案 1：使用 concat（）和 apply（）

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];function flatten(arr) {var myNewArray = [].concat.apply([], myArray);return myNewArray;}flatten(myArray);// [1, 2, 3, 4, 5, 6, 7, 8, 9]

解决方案 2：使用 reduce（）

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];function flatten(arr) {var myNewArray =  myArray.reduce(function(prev, curr) {return prev.concat(curr);
});return myNewArray;}flatten(myArray);
// [1, 2, 3, 4, 5, 6, 7, 8, 9]

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];function flatten(arr) {return arr.reduce((res,next) =>{return res.concat(Array.isArray(next)? flatten(next) : next);},[]);}flatten(myArray);// [1, 2, 3, 4, 5, 6, 7, 8, 9]

解决方案 3：递归遍历

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];function flatten(arr) {let result = []for (const item of arr) {if (Array.isArray(item)) {result = result.concat(flatten1(item))} else {result.push(item)}}return result}flatten(myArray);// [1, 2, 3, 4, 5, 6, 7, 8, 9]

解决方案 4：在 ES6 中使用点差运算符(扩展运算符)

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];function flatten(arr) {var myNewArray =  [].concat(...arr);return myNewArray;}flatten(myArray);
// [1, 2, 3, 4, 5, 6, 7, 8, 9]

解决方案 5：在 ES10 中使用 flat（）

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];function flatten(arr) {var myNewArray =  myArray.flat();return myNewArray;}flatten(myArray);
// [1, 2, 3, 4, 5, 6, 7, 8, 9]

解决方案 6：for循环

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];function flatten(arr) {var res = [];for (let i = 0, length = arr.length; i < length; i++) {if (Array.isArray(arr[i])) {res = res.concat(flatten(arr[i])); //concat 并不会改变原数组//res.push(...flatten(arr[i])); //扩展运算符} else {res.push(arr[i]);}}return res;}flatten(myArray);
//[1, 2, 3, 4, 5, 6, 7, 8, 9]

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];function flatten(arr) {var myNewArray =  [];
for (var i = 0; i < arr.length; ++i) {for (var j = 0; j < arr[i].length; ++j)myNewArray.push(arr[i][j]);
}return myNewArray;}flatten(myArray);
// [1, 2, 3, 4, 5, 6, 7, 8, 9]

解决方案7：while循环

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];
function flatten(arr) {while (arr.some(item => Array.isArray(item))) {arr = [].concat(...arr);//arr = Array.prototype.concat.apply([],arr);}return arr;}flatten(myArray);//[1, 2, 3, 4, 5, 6, 7, 8, 9]

解决方案 8：使用toString()+split()或者join()+split()

原理很简单，先把数组转换成字符串，这个过程会吧[]去掉，然后再调用split()方法转换成数组,最后不能忘了，吧每一项转换为数组，即调用map()方法。

方法1：arr.toString().split(',').map(item => +item);

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];function flatten(arr) {return arr.toString().split(',').map(item => +item);}flatten(myArray);// [1, 2, 3, 4, 5, 6, 7, 8, 9]

方法2：arr.join(',').split(',').map(item => +item);

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];function flatten(arr) {return arr.join(',').split(',').map(item => +item);}flatten(myArray);(9) [1, 2, 3, 4, 5, 6, 7, 8, 9]

解决方案 9：正则表达式

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];function flatten(arr) {let result = JSON.stringify(arr); // JSON.stringify 转换后的结果 '[1,[2,34,[12,4]],23]'result = result.replace(/(\[|\])/g, '');return JSON.parse(`[${result}]`)}flatten(myArray);(9) [1, 2, 3, 4, 5, 6, 7, 8, 9]

解决方案 10：栈

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];function flatten(arr) {let res = [];const stack = [].concat(arr);while (stack.length > 0) {// pop()方法从数组中删除最后一个元素，并返回该元素的值。此方法更改数组的长度。const item = stack.pop();if (Array.isArray(item)) {/*** push() 方法将一个或多个元素添加到数组的末尾，并返回该数组的新长度。* 用扩展运算符展开一层*/stack.push(...item);} else {// unshift() 方法将一个或多个元素添加到数组的开头，并返回该数组的新长度(该方法修改原有数组)。item !== undefined && res.unshift(item);}}return res;}flatten(myArray);// [1, 2, 3, 4, 5, 6, 7, 8, 9]

资料：

JS数组扁平化的一些方法(7-8种) - 掘金引子：这些日子在看es相关的新属性是有一个数组的方法 flat() 引起的我的注意。我去找了一下维基百科，上面并没有关于扁平化的直接解释，只有一个扁平化组织释义。金字塔组织，这个众所周知，它表现的层级结构就是一个金字塔式的形状。扁平化组织（Flat organizatio…https://juejin.cn/post/6844903805876699150js数组扁平化的六种方法_爱吃肉的薄凉的博客-CSDN博客_js数组扁平化处理我也不知道为什么要整理这么多种方法，算是拓展个思路吧。

JavaScript数组的扁平化：将 2D JavaScript 二维数组转换为 1D 一维数组（多种方法）相关推荐

c语言一维数组转化为二维矩阵,js将一维数组转化为二维数组
遇到的问题: 后端返回的是一组一维数组,但是需要展示的格式是二维数组,常见的场景举例:后台返回10个长度的数组,需要分成3个一组展示在banner上. 例:[1,2,3,4,5,6,7,8,9,10] ...
Javascript对象进行扁平化处理
Javascript对象进行扁平化处理笔主在经过多次的笔试中,发现经常会遇到对象扁平化处理的编程题,但是在笔试过程中,脑子一片空白,以至于没有平常心的去对待问题的本质. 扁平化处理简而言之就是对对象 ...
【web前端特效源码】使用HTML5+CSS3+JavaScript制作一个扁平化风格css螃蟹图形~~适合初学者~超简单~ |前端开发|IT软件
b站视频演示效果: [web前端特效源码]使用HTML5+CSS3+JavaScript制作一个扁平化风格css螃蟹图形~~适合初学者~超简单~ |前端开发|IT软件效果图: 完整代码: <! ...
uniapp中根据URL链接生成二维码（适用所有Javascript运行环境的前端应用）,保存二维码到本地相册。
推荐一款适用所有Javascript运行环境的二维码生成组件. uQRCode是一款基于Javascript环境开发的二维码生成插件,适用所有Javascript运行环境的前端应用和Node.js应用 ...
Python使用numpy函数vsplit垂直（行角度）拆分numpy数组（返回拆分后的numpy数组列表）实战：垂直拆分二维numpy数组、split函数垂直拆分二维numpy数组
Python使用numpy函数vsplit垂直(行角度)拆分numpy数组(返回拆分后的numpy数组列表)实战:垂直拆分二维numpy数组.split函数垂直拆分二维numpy数组目录
PHP常用数组函数（含按键值删除二维数组中的元素）
// 1.array_search():在数组中搜索键值"red",并返回它的键名 $a=array("a"=>"red"," ...
遍历二维数组_Java编程基础阶段笔记 day06 二维数组
二维数组笔记Notes 二维数组二维数组声明二维数组静态初始化与二位初始化二维数组元素赋值与获取二维数组遍历二维数组内存解析打印杨辉三角 Arrays工具类数组中常见的异常二维数组 ...
Java黑皮书课后题第8章：*8.13（定位最大的元素）编写下面的方法，返回二维数组中最大元素的位置。返回值是包含两个元素的一维数组，这两个元素表示二维数组中最大元素的行下标和列下标
*8.13(定位最大的元素)编写下面的方法,返回二维数组中最大元素的位置.返回值是包含两个元素的一维数组,这两个元素表示二维数组中最大元素的行下标和列下标题目题目描述与运行示例破题代码题目 ...
数据结构一【树状数组】普通、二维、离线树状数组的(单点修改，单点查询，区间修改，区间查询)模板及应用例题总结
文章目录树状数组 lowbit 线段树与树状数组单点修改区间查询区间修改区间求和二维树状数组离线树状数组例题 POJ:stars MooFest [SDOI2009]HH的项链 Tur ...

JavaScript数组的扁平化：将 2D JavaScript 二维数组转换为 1D 一维数组（多种方法）

方法：

解决方案 1：使用 concat（）和 apply（）

解决方案 2：使用 reduce（）

解决方案 3：递归遍历

解决方案 4：在 ES6 中使用点差运算符(扩展运算符)

解决方案 5：在 ES10 中使用 flat（）

解决方案 6：for循环

解决方案7：while循环

解决方案 8：使用toString()+split()或者join()+split()

解决方案 9：正则表达式

解决方案 10：栈

JavaScript数组的扁平化：将 2D JavaScript 二维数组转换为 1D 一维数组（多种方法）相关推荐

最新文章

热门文章

JavaScript数组的扁平化：将 2D JavaScript 二维数组转换为 1D 一维数组（多种方法）

方法：

​ 解决方案 1：使用 concat（） 和 apply（） ​

​ 解决方案 2：使用 reduce（） ​

解决方案 3：递归遍历

解决方案 4：在 ES6 中使用点差运算符(扩展运算符)

​ 解决方案 5：在 ES10 中使用 flat（） ​

解决方案 6：for循环

解决方案7：while循环

解决方案 8：使用toString()+split()或者join()+split()

解决方案 9：正则表达式

解决方案 10：栈

JavaScript数组的扁平化：将 2D JavaScript 二维数组转换为 1D 一维数组（多种方法）相关推荐

最新文章

热门文章

解决方案 1：使用 concat（）和 apply（）

解决方案 2：使用 reduce（）

解决方案 5：在 ES10 中使用 flat（）