扁平化的实现

数组的扁平化其实就是将一个嵌套多层的数组 array（嵌套可以是任何层数）转换为只有一层的数组。举个简单的例子，假设有个名为 flatten的函数可以做到数组扁平化，效果如下面这段代码所示。

var arr = [1, [2, [3, 4，5]]];
console.log(flatten(arr)); // [1, 2, 3, 4，5]

其实就是把多维的数组“拍平”，输出最后的一维数组。

方法一：普通的递归实现

普通的递归思路很容易理解，就是通过循环递归的方式，一项一项地去遍历，如果每一项还是一个数组，那么就继续往下遍历，利用递归程序的方法，来实现数组的每一项的连接。我们来看下这个方法是如何实现的，如下所示。

  const a = [1, [2, [3, [4, 5]]]];const flatten = (arr) => {let result = [];for (let i = 0; i < arr.length; i++) {if (Array.isArray(arr[i])) {result = result.concat(flatten(arr[i]));} else {result.push(arr[i]);}}return result;};console.log(flatten(a));

从上面这段代码可以看出，最后返回的结果是扁平化的结果，这段代码核心就是循环遍历过程中的递归操作，就是在遍历过程中发现数组元素还是数组的时候进行递归操作，把数组的结果通过数组的 concat方法拼接到最后要返回的 result数组上，那么最后输出的结果就是扁平化后的数组。

方法二：利用 reduce 函数迭代

从上面普通的递归函数中可以看出，其实就是对数组的每一项进行处理，那么我们其实也可以用帮你梳理眼花缭乱的数组 API中说的 reduce来实现数组的拼接，从而简化第一种方法的代码，改造后的代码如下所示。

  const flatten = (arr) => {return arr.reduce((prev,next)=>{return prev.concat(Array.isArray(next)?flatten(next):next)},[]);};console.log(flatten(a));

方法三：扩展运算符实现

这个方法的实现，采用了扩展运算符和 some的方法，两者共同使用，达到数组扁平化的目的，还是来看一下代码。

  const flatten = (arr) => {while(arr.some(item=>Array.isArray(item))){arr = [].concat(...arr);}return arr;};console.log(flatten(a));

从执行的结果中可以发现，我们先用数组的 some方法把数组中仍然是组数的项过滤出来，然后执行 concat操作，利用 ES6的展开运算符，将其拼接到原数组中，最后返回原数组，达到了预期的效果。

前三种实现数组扁平化的方式其实是最基本的思路，都是通过最普通递归思路衍生的方法，尤其是前两种实现方法比较类似。值得注意的是 reduce方法，它可以在很多应用场景中实现，由于 reduce这个方法提供的几个参数比较灵活，能解决很多问题，所以是值得熟练使用并且精通的。

方法四：split 和 toString 共同处理

  const flatten = (arr) => {return arr.toString().split(',')};console.log(flatten(a));

通过这两个方法可以将多维数组直接转换成逗号连接的字符串，然后再重新分隔成数组

方法五：调用 ES6 中的 flat

我们还可以直接调用 ES6 中的 flat方法，可以直接实现数组扁平化。先来看下 flat 方法的语法：

arr.flat([depth])

其中 depth是 flat的参数，depth是可以传递数组的展开深度（默认不填、数值是 1），即展开一层数组。那么如果多层的该怎么处理呢？参数也可以传进 Infinity，代表不论多少层都要展开。那么我们来看下，用 flat方法怎么实现，请看下面的代码。

  const a = [1, [2, [3, [4, 5]]]];const flatten = (arr) => {return arr.flat(Infinity)};console.log(flatten(a));

可以看出，一个嵌套了两层的数组，通过将 flat方法的参数设置为 Infinity，达到了我们预期的效果。其实同样也可以设置成 3，也能实现这样的效果。

因此，在编程过程中，发现对数组的嵌套层数不确定的时候，最好直接使用 Infinity，可以达到扁平化.

方法六：正则和 JSON 方法共同处理

在第四种方法中已经尝试了用 toString方法，其中仍然采用了将 JSON.stringify 的方法先转换为字符串，然后通过正则表达式过滤掉字符串中的数组的方括号，最后再利用 JSON.parse 把它转换成数组。请看下面的代码。

  const flatten = (arr) => {let str = JSON.stringify(arr);str = str.replace(/(\[|\])/g,'');str = `[${str}]`;return JSON.parse(str);};console.log(flatten(a));

可以看到，其中先把传入的数组转换成字符串，然后通过正则表达式的方式把括号过滤掉

总结

数组扁平化这节课的知识点结合了数组 API、ES6，以及 JSON方法的相关知识。可以通过下面的表格再来看一下这六种方式的代码思路。

方法/问题	实现难度	编码思路
递归实现	易	递归实现，返回新数组
reduce实现	中	reduce进行累加操作
扩展运算符实现	中	筛选出数组项进行连接
split和toString	易	转成字符串再转数组
flat方法	易	特定功能方法直接操作
正则和JSON方法	易	JSON方法转成字符串转回过程中正则处理

文章转载于：http://t.csdn.cn/nrI2y

实现数组扁平化的6种方法相关推荐

JAVA数组扁平化整合_5种方法实现数组扁平化
数组扁平化概念数组扁平化是指将一个多维数组变为一维数组 [1, [2, 3, [4, 5]]] ------> [1, 2, 3, 4, 5] 复制代码实现 1. reduce 遍历数组每一 ...
实现数组扁平化的 6 种方式
实现数组扁平化的 6 种方式老规矩,开局先上问题,带着问题去思考: 怎样用最普通的方法解决数组扁平化问题? ES6里面是否有一些高级的方法能够直接实现? 扁平化的实现数组的扁平化其实就是将一个 ...
JAVA数组扁平化整合_数组扁平化的几种处理放法
清明节,这几天放假闲来无事,好好研究一下基础知识,今天看看数组扁平化该怎么处理: 先来看数组扁平化是什么: var arr = [1,2,3,4,[5,6,[7,8]],true] => [1, ...
实现数组扁平化的6种方式
扁平化的实现数组的扁平化其实就是将一个嵌套多层的数组 array(嵌套可以是任何层数)转换为只有一层的数组. 普通的递归实现普通的递归思路很容易理解,就是通过循环递归的方式,一项一项地去遍历,如果 ...
JS手写数组扁平化（flat）方法
方法介绍数组扁平化方法 Array.prototype.flat() 也叫数组拍平.数组拉平.数组降维. Array.prototype.flat() 用于将嵌套的数组"拉平", ...
实现数组扁平化的几种方式
简单实现: // 来个示例数组let arr = [1, [2, [3, [4, [5]]]]] //方法1:flat() 默认拉平一层嵌套数组,传入数字几就拉平几层//Infinity 是无穷大,不 ...
JAVA数组扁平化整合_一文搞定数组扁平化（超全面的数组拉平方案及实现）
前言面试手写代码在大厂面试中非常常见,秋招中面试小米就手写了一道flat实现的代码题,当时通过递归方式实现了数组扁平化逻辑,但没有考虑多种实现方案及其边界条件(主要是对所涉及到高阶函数的知识点不够熟 ...
你能想到几种方式实现数组扁平化（越多越好）
数组扁平化:将一个多维数组,展开成一个一维数 let arr = [1,[2,3],[4,[5,6,[7]]],8]; ⇒ [1,2,3,4,5,6,7,8] 数组中嵌套数组自然会想到利用递归来做,只 ...
php n维数组扁平化,js嵌套的数组扁平化:将多维数组变成一维数组以及push()与concat()区别的讲解...
数组的扁平化:将多维数组变成一维数组对于一个像这样的嵌套数组:a=[1,[2,[3,4]],5,6]我们想要把它变成一个一维数组,有下面几种方法: 方法一:递归一 function parseArr ...

实现数组扁平化的6种方法