一. 普通递归的思路很容易理解,就是通过for
循环的方式,逐层逐个元素地去展平,如果当前元素是一个数组,那么就对它进行递归处理,再将递归处理的结果拼接到结果数组上
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 = result.concat(flatten(arr[i]));
}
// 否则直接加入结果数组
else {
result.push(arr[i]);
}
}
return result;
}
console.log(flatten(a)); // [1, 2, 3, 4,5]
二. reduce
是JS
数组中非常强大的一个方法,同时也是JS
中的一个函数式编程API
。
上面的递归实现的关键就是对数组的每一项进行处理,遇到数组就递归处理它,既然需要循环和结果数组,那么我们可以使用reduce
来简化我们的代码:
let arr = [1, [2, [3, 4]]];
function flatten(arr) {
return arr.reduce(function(pre, cur){
return pre.concat(Array.isArray(cur) ? flatten(cur) : cur)
}, [])
}
console.log(flatten(arr));// [1, 2, 3, 4,5]
三. 扩展运算符是ES6
的新特性之一,用它操作数组可以直接展开数组的第一层,利用这个特性,我们可以不使用递归来实现数组的展平,这是因为每一次递归都是对当前层次数组的一次展开,而扩展操作符就是干这工作的。
let arr = [1, [2, [3, 4]]];
function flatten(arr) {
while (arr.some(i => Array.isArray(i))) {
arr = [].concat(...arr);
}
return arr;
}
console.log(flatten(arr)); // [1, 2, 3, 4,5]
四. 正则实现也是先将数组转换成字符串的表达形式,这里将数组转成字符串我们使用JSON.stringify方法,将数组转换成一个由括号包裹、元素间以逗号相隔的字符串,例如"[1, [2, [3, [4, 5]]], 6]"
,从转换后的字符可以发现,每一对括号包着的范围就是一个层级,数组的展平就是将内部的层级全部消除,只保留最外层,在这里,就是将括号全部替换成空字符,得到一个元素以逗号相隔字符串,最后将利用JSON.parse方法解析成数组对象。
let arr = [1, [2, [3, [4, 5]]], 6];
function flatten(arr) {
let str = JSON.stringify(arr);
str = str.replace(/(\[|\])/g, '');
// 拼接最外层,变成JSON能解析的格式
str = '[' + str + ']';
return JSON.parse(str);
}
console.log(flatten(arr)); // [1, 2, 3, 4,5]
五. Array.prototype.flat
是ES6
新增的一个数组方法,它的作用就是用来数组扁平化,并且根据传入的参数来决定展开的层级,是数组扁平化的终极解决方案。
let arr = [1, [2, [3, 4]]];
function flatten(arr) {
return arr.flat(Infinity);
}
console.log(flatten(arr)); // [1, 2, 3, 4,5]
以上方式也可以将任意类型的数组扁平化,已经尝试过,可以直接用