庖丁解“鱼”：JavaScript 数组扁平化/降维艺术

2023-11-27 04:22:59

数组扁平化概述

数组扁平化是指将多维数组转化为一维数组的过程。在 JavaScript 中，数组可以包含其他数组，形成多维数组结构。然而，在某些情况下，我们需要将多维数组“摊平”成一维数组，以便进行进一步的操作。例如，当我们需要对数组中的所有元素进行遍历、排序或求和时，扁平化操作就非常有用。

方法一：Array.prototype.flat()

Array.prototype.flat() 是 ES6 中引入的数组方法，专门用于数组扁平化。它可以将多维数组展平成一维数组，并接受一个可选的深度参数。该参数指定要展平的数组深度，默认为 1，即只展平一层。

const arr = [[1, 2, [3, 4]], [5, 6, [7, 8]]];
const flattenedArr = arr.flat();
console.log(flattenedArr);
// 输出：[1, 2, 3, 4, 5, 6, 7, 8]

方法二：数组字符串化

数组字符串化是指将数组转换为字符串，然后再将字符串解析回数组。这种方法简单易懂，但性能较差，不适用于大型数组。

const arr = [[1, 2, [3, 4]], [5, 6, [7, 8]]];
const flattenedArr = arr.toString().split(',').map(Number);
console.log(flattenedArr);
// 输出：[1, 2, 3, 4, 5, 6, 7, 8]

方法三：递归

递归是一种将问题分解为更小规模的子问题，然后逐层解决子问题直至达到基本情况的方法。对于数组扁平化，我们可以使用递归来逐层拆解多维数组，直至得到一维数组。

const flatten = (arr) => {
  const result = [];
  for (let i = 0; i < arr.length; i++) {
    if (Array.isArray(arr[i])) {
      result.push(...flatten(arr[i]));
    } else {
      result.push(arr[i]);
    }
  }
  return result;
};

const arr = [[1, 2, [3, 4]], [5, 6, [7, 8]]];
const flattenedArr = flatten(arr);
console.log(flattenedArr);
// 输出：[1, 2, 3, 4, 5, 6, 7, 8]

方法四：reduce + concat + 递归

我们可以使用 reduce + concat + 递归来实现数组扁平化。reduce 函数可以将数组中的元素逐个累积起来，concat 函数可以将两个数组连接起来，递归函数可以将多维数组逐层拆解成一维数组。

const flatten = (arr) => {
  return arr.reduce((acc, cur) => {
    return acc.concat(Array.isArray(cur) ? flatten(cur) : cur);
  }, []);
};

const arr = [[1, 2, [3, 4]], [5, 6, [7, 8]]];
const flattenedArr = flatten(arr);
console.log(flattenedArr);
// 输出：[1, 2, 3, 4, 5, 6, 7, 8]