运用js实现数组的扁平化-蒲公英云

运用js实现数组的扁平化

一、数组的扁平化

数组的扁平化是将一个多维数组变为一个一维数组
核心思想：遍历数组arr，若arr[i] 为数组则递归遍历，直到arr[i]不为数组的时候，再与之前的结果concat连接起来

二、数组的扁平化实现

ES6的扩展运算符 (…)

1）思路说明：在函数flatten()，通过arr.some()的方法用来检测数组中的元素是否满足指定的条件，通过遍历数组的元素，Array.isArray() 检测arr中是否含有数组，如果有数组满足条件那么就通过使用ES6的扩展运算符…,将一个数组转换为用逗号隔开的参数序列，连接并赋值给传入的形参数组arr，直到没有，最后返回，实现数组的扁平化，将多维变为一维数组

2）实现代码：

var arr1 = [1,[2,[3,4]]];
  function flatten1(arr) { 
    while(arr.some ( item => Array.isArray(item))){ 
      arr = [].concat(...arr);
    }
    return arr;
  }
  console.log(flatten1(arr1));

reduce 的方法

1）思路说明：通过arr.reduce() 方法，为数组中的每一个元素依次执行回调函数，遍历数组的每一项，如果值为数组，那么就递归遍历，否则concat 连接数组

2）实现代码：

var arr2 = [1,[2,[3,4]]];
   function flatten2 (arr) { 
     return arr.reduce((result, item) => { 
       return result.concat(Array.isArray(item) ? flatten2(item) : item);
     }, []);
   }
   console.log(flatten2(arr2));

toString 和 split 的方法

1）思路说明：通过arr.toString() 的方法将数组变为字符串，然后通过split() 的方法分割字符串，
通过map() 的方法遍历每一项转换为数组型

2）实现代码：

var arr3 = [1,[2,[3,4]]];
    function flatten3 (arr) { 
      return arr.toString().split(',').map(function(item) { 
        return Number(item);
      })
    }
    console.log(flatten3(arr3));

join 和 split 的方法

1）思路说明：通过arr.join() 的方法将数组的所有元素放入一个字符串中，元素通过指定的分隔符进行分割，然后通过split() 的方法分割字符串，通过map() 的方法遍历每一项转为数值型

2）实现代码：

var arr4 = [1,[2,[3,4]]];
    function flatten4 (arr) { 
      return arr.join(',').split(',').map( function(item) { 
          return Number(item);
      })
    }
    console.log(flatten4(arr4));

map的遍历

1）思路说明：创建一个空数组，通过arr.map() 的方法递归遍历传入数组的每一项，若为数组那么就继续遍历，否则concat

2）实现代码：

var arr5 = [1,[2,[3,4]]];
    function flatten5 (arr) { 
       var res = [];
       arr.map( item => { 
         if(Array.isArray(item)) { 
           res = res.concat( flatten5(item));
         }else { 
            res.push(item);
         }
       });
       return res;
    }
    console.log(flatten5(arr5));