JS实现数组扁平化的五种方法和手动实现flat函数

盘点JS实现数组扁平化的五种方法

// 1. 直接用ES6的 flat(depth) 方法扁平化数组，depth 指定要提取嵌套数组的结构深度， 默认1，入参 Infinity 表示无穷层级都扁平
const _flat = (arr) => {
  if (!Array.isArray(arr)) return arr;
  return arr.flat(Infinity);
};
// 2. 普通递归
const __flat = (arr) => {
  if (!Array.isArray(arr)) return arr;
  let newArr = [];
  for (let i = 0; i < arr.length; i++) {
    if (Array.isArray(arr[i])) {
      newArr = newArr.concat(__flat(arr[i]));
    } else {
      newArr.push(arr[i]);
    }
  }
  return newArr;
};
// 3. 用reduce递归
const ___flat = (arr) => {
  if (!Array.isArray(arr)) return arr;
  return arr.reduce(
    (prev, next) =>
      prev.concat(Array.isArray(next) ? ___flat(next) : next),
    []
  );
};
// 4. 扩展运算符和concat实现: concat可以连续接收单个或数组，即 [].concat(0,1,2,3) 或 [].concat(0,[1,2,3]) ==> [0,1,2,3]
const ____flat = (arr) => {
  while (arr.some((item) => Array.isArray(item))) {
    arr = [].concat(...arr);
  }
  return arr;
};
// 5. split 和 toString
const _____flat = (arr) => {
  return arr.toString().split(',').map(item => Number(item));
};

手动实现flat函数

const flat = (arr, depth) => {
  if (!Array.isArray(arr) || depth <= 0) return arr;
  return arr.reduce((pre, cur) =>
    pre.concat(Array.isArray(cur) ? flat(cur, depth - 1) : cur),
    []
  );
};