什么是数组扁平化:
数组拍平方法 Array.prototype.flat() 也叫数组扁平化、数组拉平、数组降维。数组的拍平方法也是数组的数组扁平化的一种叫法;
const animals = ["🐷", ["🐶", "🐂"], ["🐎", ["🐑", ["🐲"]], "🐛"]];
// 不传参数时,默认“拉平”一层
animals.flat();
// ["🐷", "🐶", "🐂", "🐎", ["🐑", ["🐲"]], "🐛"]
// 传入一个整数参数,整数即“拉平”的层数
animals.flat(2);
// ["🐷", "🐶", "🐂", "🐎", "🐑", ["🐲"], "🐛"]
// Infinity 关键字作为参数时,无论多少层嵌套,都会转为一维数组
animals.flat(Infinity);
// ["🐷", "🐶", "🐂", "🐎", "🐑", "🐲", "🐛"]
// 传入 <=0 的整数将返回原数组,不“拉平”
animals.flat(0);
animals.flat(-10);
// ["🐷", ["🐶", "🐂"], ["🐎", ["🐑", ["🐲"]], "🐛"]];
// 如果原数组有空位,flat()方法会跳过空位。
["🐷", "🐶", "🐂", "🐎",,].flat();
// ["🐷", "🐶", "🐂", "🐎"]
Array.prototype.flat() 特性总结
- Array.prototype.flat() 用于将嵌套的数组“拉平”,变成一维的数组。该方法返回一个新数组,对原数据没有影响。
不传参数时,默认“拉平”一层,可以传入一个整数,表示想要“拉平”的层数。- 传入 <=0 的整数将返回原数组,不“拉平”
- Infinity 关键字作为参数时,无论多少层嵌套,都会转为一维数组
- 如果原数组有空位,Array.prototype.flat() 会跳过空位。
可以实现数组扁平化的方法有
1、递归函数:
const flatten = (arr) => {
let result = [];
arr.forEach((item, i, arr) => {
if (Array.isArray(item)) {
result = result.concat(flatten(item));
} else {
result.push(arr[i])
}
})
return result;
};
const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));
2、toString()
/* ES6 */
const flatten = (arr) => arr.toString().split(',').map((item) => +item);
const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));
这种方法使用的场景却非常有限,必须数组中元素全部都是 Number。 也可以全部都为 String;
3、 [].concat.apply + some
- 利用 arr.some 判断当数组中还有数组的话,循环调用 flatten 扁平函数(利用 [].concat.apply扁平), 用 concat 连接,最终返回 arr
const flatten = (arr) => {
while (arr.some(item => Array.isArray(item))){
arr = [].concat.apply([], arr);
}
return arr;
}
const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));
4、reduce
function flatten(arr){
return arr.reduce(function(prev, cur){
return prev.concat(Array.isArray(cur) ? flatten(cur) : cur)
}, [])
}
const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));
ES6 中的 解构运算符 …
- … 每次只能展开最外层的数组,被 [].concat 后,arr 就扁平化一次。
function flatten(arr){
while(arr.some(item => Array.isArray(item))){
arr = [].concat(...arr);
}
return arr;
}
const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));