js数组扁平化的方法

122 阅读2分钟

写在前面的话,学习自珠峰培训的周老师的视频,然后做的课堂笔记,为了加深自己的记忆,所以写下来

原数组:arr = [1,2,3,4,[5,6,7,[8,9]]]

结果数组 arr = [1,2,3,4,5,6,7,8,9]

1.使用ES6 提供的法Array.prototype.flat方法处理

首先MDN上对这个方法的解释为:**flat()**方法创建一个新数组,所有子数组元素都以递归方式连接到该数组中,直至达到指定深度.

使用语法:var newArray = arr.flat([depth]); 这里depth表示的是要扁平的深度,默认为1.

const arr1 = [1, 2, [3, 4]];
arr1.flat(); 
// [1, 2, 3, 4]

const arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]

const arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]

const arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity);
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

如果原数组中含有空槽的话还可以,直接删除空槽

那么如何将是一数组拍平并去重然后排序呢?

1.先拍平
arr = arr.flat(Infinity)//因为是定义在原型上的方法,所以可以直接数组.flat来调用
2.去重
//new set(arr);//这之后的结果是将数组去重之后返回一个集合,我们需要将它转化回数组
arr = Array.from(new Set(arr)).sort((a,b) => a-b)

2.第二种方式是使用toString将数组直接转化为字符串,然后用split(',')转化为数组,最后将数组中的每个元素转化为数字

arr.toString().split(',').map(Number)

原因就是数组通过.toString()方法之后不管有多少级,最后都变为以逗号分隔的字符串

3. 利用JSON.stringify把json对象转化为json格式的字符串

var res = JSON.stringify(arr) 
输出的结果为:'[1,2,3,4,[5,6,7,[8,9]]]'形式的一个字符串
然后利用正则表达式将其中的[]给删掉
res.replace(/(\[|\])/g,'').split(',').map(Number)

4.基于数组的some方法

some方法的解释:

**some()**方法测试数组中的至少一个元素是否通过了由提供的函数实现的测试. 它返回一个布尔值.

arr.some(item => {

return Array.isArray(item)

})//检测数组中的每一项是不是数组

while(arr.some(item => Array.isArray(item))){
    arr = [].concat(...arr)//将每次是数组的那一项展开,再赋值给arr,一直到item不是数组的时候跳出循环
}

5. 最原始的递归方法

var arr = [1,2,3,4,[5,6,7,[8,9]]]    
function flatten(arr){      
var result = [];      
for(var i = 0; i< arr.length; i++){        
if(typeof arr[i] == 'number'){          
result.push(arr[i])        
}else if(Array.isArray(arr[i])){          
result = result.concat(flatten(arr[i]))        
}      }      
return result    
}    

console.log(flatten(arr))