JS 数组扁平化技巧：告别多维嵌套，拥抱一维数据

2023-09-09 13:06:18

数组扁平化为何必要？

在日常编码中，我们经常会遇到多维数组。例如，一个包含用户个人信息的数组可能包括姓名、年龄、地址等多个字段，每个字段可能又包含多个值。当我们需要对这些数据进行处理时，多维数组可能会导致代码难以理解和维护。因此，将多维数组扁平化为一维数组就显得尤为必要。

扁平化数组的技巧

1. 使用 Array.prototype.flat() 方法

ES2019 引入了 Array.prototype.flat() 方法，它可以将多维数组展平为一维数组。该方法接受一个可选的深度参数，指定要展平的层数。如果没有指定深度参数，则默认展平所有层级。

const multidimensionalArray = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
const flattenedArray = multidimensionalArray.flat();
console.log(flattenedArray); // [1, 2, 3, 4, 5, 6, 7, 8, 9]

2. 使用 Array.prototype.reduce() 方法

Array.prototype.reduce() 方法可以将数组中的元素逐个累积成一个最终值。我们可以利用它来实现数组的扁平化。

const multidimensionalArray = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
const flattenedArray = multidimensionalArray.reduce((accumulator, currentValue) => {
  return accumulator.concat(currentValue);
}, []);
console.log(flattenedArray); // [1, 2, 3, 4, 5, 6, 7, 8, 9]

3. 使用递归

我们可以使用递归来实现数组的扁平化。递归是指函数自身调用自身。

function flattenArray(array) {
  let flattenedArray = [];
  for (let i = 0; i < array.length; i++) {
    if (Array.isArray(array[i])) {
      flattenedArray = flattenedArray.concat(flattenArray(array[i]));
    } else {
      flattenedArray.push(array[i]);
    }
  }
  return flattenedArray;
}

const multidimensionalArray = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
const flattenedArray = flattenArray(multidimensionalArray);
console.log(flattenedArray); // [1, 2, 3, 4, 5, 6, 7, 8, 9]