js实现数组扁平化的6种⽅法
概念
数组扁平化就是将⼀个多维数组转换为⼀个⼀维数组
[1,[2,[3,4,5]]] ==> [1,2,3,4,5]
实现⽅法
下⾯就来介绍⼀下js中实现数组扁平化的6种⽅式:
1、递归实现
普通的递归思路很容易理解,就是通过循环递归的⽅式,⼀项⼀项地去遍历,如果每⼀项还是⼀个数组,那么就继续往下遍历,利⽤递归程序的⽅法,来实现数组的每⼀项的连接。
let arr =[1,[2,[3,4,5]]];
function flatten(arr){
let result =[];
for(let i =0; i < arr.length; i++){
if(Array.isArray(arr[i])){
result = at(flatten(arr[i]));
}else{
result.push(arr[i]);
}
}
return result;
}
console.log(flatten(arr));//  [1, 2, 3, 4,5]
2、reduce 函数迭代
从上⾯普通的递归函数中可以看出,其实就是对数组的每⼀项进⾏处理,那么其实也可以⽤reduce 来实现数组的拼接,从⽽简化第⼀种⽅法的代码,改造后的代码如下所⽰:
let arr =[1,[2,[3,4]]];
function flatten(arr){
duce(function(prev, next){
at(Array.isArray(next)?flatten(next): next)
},[])
}
console.log(flatten(arr));//  [1, 2, 3, 4,5]
3、split 和 toString
可以通过 split 和 toString 两个⽅法来共同实现数组扁平化,由于数组会默认带⼀个 toString 的⽅法,所以可以把数组直接转换成逗号分隔的字符串,然后再⽤ split ⽅法把字符串重新转换为数组,如下⾯
的代码所⽰:
let arr =[1,[2,[3,4]]];
function flatten(arr){
String().split(',');
}
console.log(flatten(arr));//  [1, 2, 3, 4,5]
4、通过扩展运算符实现
这个⽅法的实现,采⽤了扩展运算符和 some 的⽅法,两者共同使⽤,达到数组扁平化的⽬的:
let arr =[1,[2,[3,4]]];
function flatten(arr){
while(arr.some(item => Array.isArray(item))){
arr =[].concat(...arr);
}
return arr;
}
console.log(flatten(arr));//  [1, 2, 3, 4,5]
5、ES6 中的 flat
我们还可以直接调⽤ ES6 中的 flat ⽅法来实现数组扁平化。flat ⽅法的语法:arr.flat ( [depth] )
其中 depth 是 flat 的参数,depth 是可以传递数组的展开深度(默认不填、数值是 1),即展开⼀层数组。如果层数不确定,参数可以传进 Infinity,代表不论多少层都要展开:
let arr =[1,[2,[3,4]]];
function flatten(arr){
return arr.flat(Infinity);
}
console.log(flatten(arr));//  [1, 2, 3, 4,5]
6、使⽤正则和 JSON ⽅法
在第4种⽅法中已经使⽤ toString ⽅法,其中仍然采⽤了将 JSON.stringify 的⽅法先转换为字符串,然后通过正则表达式过滤掉字符串中的数组的⽅括号,最后再利⽤ JSON.parse 把它转换成数组:
javascript全局数组let arr =[1,[2,[3,[4,5]]],6];
function flatten(arr){
let str =JSON.stringify(arr);
str = place(/(\[|\])/g,'');
str ='['+ str +']';
return JSON.parse(str);
}
console.log(flatten(arr));//  [1, 2, 3, 4,5]

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。