多维数组扁平化处理

1.循环递归

var arr = [[1, 2, 8, [6, 7]], 3, [3, 6, 9], 4]

function getNewArr(arr) {
  // 定义新数组用于存储所有元素
  var newArr = []
  // 遍历原数组中的每个元素
  for (var i = 0; i < arr.length; i++) {
    // 判断当前元素是否为数组
    if (Array.isArray(arr[i])) {
      // 若当前元素为数组时，调用函数本身继续判断，通过 concat 方法连接函数返回的数组
      newArr = newArr.concat(getNewArr(arr[i]))
    } else { // 若不是数组直接将当前元素追加到新数组的末尾
      newArr.push(arr[i])
    }
  }
  // 循环结束将新数组返回
  return newArr
}

console.log(arr) // [[1, 2, 8, [6, 7]], 3, [3, 6, 9], 4]
console.log(getNewArr(arr)) // [1, 2, 8, 6, 7, 3, 3, 6, 9, 4]

2.toString、split和map结合

var arr = [[1, 2, 8, [6, 7]], 3, [3, 6, 9], 4]

function getNewArr(arr) {
  var newArr = arr.toString().split(',').map(function(item) {
    // 使用 + 号将当前元素转成数字
    return +item
  })

  return newArr
}

console.log(getNewArr(arr)) // [1, 2, 8, 6, 7, 3, 3, 6, 9, 4]

3.arr.flat  

let arr = [[1,2],[3,4],[[6,7],[[8],[9,10]]]];
let el = arr.flat(Infinity);
console.log(el);  // [1, 2, 3, 4, 6, 7, 8, 9, 10];

4.es6 展开运算符

// 利用arr.some判断当数组中还有数组的话，递归调用flatten扁平函数(利用es6展开运算符扁平), 用concat连接，最终返回arr;
function steamroller4(arr){
  while(arr.some(item=> Array.isArray(item))){
    // arr=[].concat.apply([],arr)
    arr=[].concat(...arr)
  }
  return arr
}
console.log(steamroller4(arr))

5.reduce方法

// 当数组中还有数组的话，递归调用steamroller3扁平函数(利用reduce扁平), 用concat连接，最终返回arr.reduce的返回值;
function steamroller3(arr){
  return arr.reduce((prev,next)=>{
    return prev.concat(Array.isArray(next)?steamroller3(next):next)
  },[])
}
console.log(steamroller3(arr))

6.利用apply+some

// 利用arr.some判断当数组中还有数组的话，递归调用steamroller2扁平函数(利用apply扁平), 用concat连接，最终返回arr;
function steamroller2(arr){
  while(arr.some(item=> Array.isArray(item))){
    arr=[].concat.apply([],arr)
  }
  return arr
}
console.log(steamroller2(arr))

7.arr.flatMap()

//对原数组的每个成员执行一个函数（相当于执行Array.prototype.map()），然后对返回值组成的数组执行flat()方法。该方法返回一个新数组，不改变原数组
// 相当于 [[2, 4], [3, 6], [4, 8]].flat()
[2, 3, 4].flatMap((x) => [x, x * 2])
// [2, 4, 3, 6, 4, 8]