JS 数组扁平化的5种方式

什么是数组扁平化

• 数组扁平化是指将一个多维数组变为一维数组

数据准备

let arr = [[null], "kevin", 18, [{}, { a: "223", b: "666" }], [[1, {}, [[[1, 2, 3]], 4, 5, 6]]], 1, 2, 3];
// 是数组
function isArray(arr) {
  return Object.prototype.toString.call(arr) == '[object Array]'
}
// 是对象
function isObject(obj) {
  return Object.prototype.toString.call(obj) == '[object Object]'
}

实现方法一

function flatten(arr=[]) {
  let resArr = []
  let len = arr.length
  for (let i = 0; i < len; i++) {
    if (isArray(arr[i])) {
      resArr = resArr.concat(flatten(arr[i]))
    } else {
      resArr.push(arr[i])
    }
  }
  return resArr
}
console.log(flatten(arr))

实现方法二

Array.prototype.flatten = function () {
  let resArr = []
  this.forEach(function (item) {
    Object.prototype.toString.call(item) == '[object Array]' ? resArr = resArr.concat(item.flatten()) : resArr.push(item)
  })
  return resArr
}
console.log(arr.flatten())

实现方法三

function flatten(arr=[]) {
  return arr.reduce(function (prev, next) {
    return Object.prototype.toString.call(next) == '[object Array]'? prev.concat(flatten(next)) : prev.concat(next)
  }, [])
}
console.log(flatten(arr))

实现方法四

const flatten = arr => arr.reduce((prev,next) => Object.prototype.toString.call(next) == '[object Array]'? prev.concat(flatten(next)) : prev.concat(next),[])
    console.log(flatten(arr))

实现方法五

• 使用 es6 的 flat(n) 方法， n 表示层数， Infinity表示完全扁平

console.log(arr.flat(Infinity));

---

image.png

前面四种方法，核心也只有一个：
遍历数组arr，若arr[i]为数组则递归遍历，直至arr[i]不为数组然后与之前的结果concat。

END