JS底层--手撕代码之数组扁平化
前言
数组扁平化(又称数组将维)是我们在面试当中经常会碰到的问题,也是我们必须要掌握的问题,考察的主要是js
的底层功力。数组的扁平化,就是将一个嵌套多层的数组 array
(嵌套可以是任何层数)转换为只有一层的数组。即将一个多维数组转化为一个一维数组
实现基本思路
- 对数组的每一项进行遍历
- 判断该项是否是数组
- 如果该项不是数组则将其直接放进新数组
- 是数组则回到
1
,继续迭代 - 当数组遍历完成,返回这个新数组
方法一、递归处理
代码如下
function flatten(arr) {
var result = [];//定义一个新数组
for (var i = 0, len = arr.length; i < len; i++) {
if (Array.isArray(arr[i])) {//判断是否为数组 如果元素为数组则进入
result = result.concat(flatten(arr[i]))// concat 合并数组,内部进行嵌套
} else {
result.push(arr[i])//符合条件则嵌套进数组
}
}
return result;
}
var arr=[1,2,[3,4,[5,6]]];
console.log(flatten(arr));// [ 1, 2, 3, 4, 5, 6 ]
方法二、拓展运算符方法
拓展运算符方法,用于取出参数对象的所有可遍历属性,拷贝到当前对象之中
function flatten(arr) {
while(arr.some(item => Array.isArray(item))) {
arr = [].concat(...arr);
}
return arr;
}
var arr=[1,2,[3,4,[5,6]]];
console.log(flatten(arr));// [ 1, 2, 3, 4, 5, 6 ]
方法三、toStirng方法
利用toString
方法,把数组直接转化为逗号分隔的字符串,然后再利用split
方法把字符串重新转换为数组
return arr.toString().split(',');
}
var arr=[1,2,[3,4,[5,6]]];
console.log(flatten(arr));// [ '1', '2', '3', '4', '5', '6' ]
方法四、reduce
我们传递了两个参数, 第一个参数就是就是处理扁平化的箭头函数,第二个参数是一个空数组,也是作为遍历的开始。
function flatten(arr) {
return arr.reduce((res, next) => {
return res.concat(next instanceof Array ? flatten(next) : next)
}, [])
}
var arr=[1,2,[3,4,[5,6]]];
console.log(flatten(arr));// [ 1, 2, 3, 4, 5, 6 ]
总结
对于js的底层原理的理解,笔者也是小白一个,正在不断地学习过程当中,还望各位大佬多多指教。