定义

多维数组扁平化就是将多维数组(数组里的元素依然为数组)转化为一维数组

举例 : [1,2,[3,4],[[5,6],7],8]进行多维数组扁平化操作后生成的数组为[1,2,3,4,5,6,7,8]

主要方法

1.递归(concat与push)

const arr = [1,2,3,[4,5],[6,7],[[8,9],[10,11]]]
// 定义全局变量用于存储元素
const newArray = []
function getNewArr(arr) {
        for (let i = 0; i < arr.length; i++) {
            // 如果是数组则将里层再次扁平化后与newArray拼接
            if (Array.isArray(arr[i])) {
                newArray.concat(newArr(arr[i]))
            // 如果不是数组则直接push到newArray的最后
            }else{
                newArray.push(arr[i])
            }
            
        }
     }
     // 调用函数
     getNewArr(arr)
     
     console.log(newArray);

2. 递归(push)

此方法为方法1的优化版本

const arr = [1,2,3,[4,5],[6,7],[[8,9],[10,11]]]
// 定义全局变量用于存储元素
const newArr = []

function getNewArr(arr, newArr) {
  for (let i = 0; i < arr.length; i++) {
    // 判断数组中的当前元素是否是数组
    if (Array.isArray(arr[i])) {
      // 如果是数组时继续调用函数再次进行判断
      getNewArr(arr[i], newArr)
    } else {
      // 如果不是数组,则将当前元素追加到newArr中
      newArr.push(arr[i])
    }
  }
}
// 调用函数
getNewArr(arr, newArr)

console.log(newArr) 

3. 转为字符串

const arr =  [1,2,3,[4,5],[6,7],[[8,9],[10,11]]]

function getNewArr(arr) {

  const newArr = arr.toString().split(',').map(function(item) {
    // arr.toString()这一步的结果为 '1,2,3,4,5,6,7,8,9,10,11'
    // 再使用split(',')的结果为 [1,2,3,4,5,6,7,8,9,10,11]
    // 使用 + 号将当前元素转成数字
    return +item
  })

  return newArr
}

console.log(getNewArr(arr))

4. ES6新语法 flat

const arr =  [1,2,3,[4,5],[6,7],[[8,9],[10,11]]]
// Infinity表示不管嵌套多少层均能扁平化
console.log(arr.flat(Infinity))

关于flat的知识点

//默认为1层
console.log([1 ,[2, 3]].flat()); // [1, 2, 3]
 
// 指定转换的嵌套层数
console.log([1, [2, [3, [4, 5]]]].flat(2)); // [1, 2, 3, [4, 5]]
 
// 不管嵌套多少层
console.log([1, [2, [3, [4, 5]]]].flat(Infinity)); // [1, 2, 3, 4, 5]
 
// 自动跳过空位
console.log([1, [2, , 3]].flat()); // [1, 2, 3]