JavaScript之数组扁平化详解

什么是数组扁平化

数组扁平化是指将一个嵌套多层的多维数组变成一个一维数组的过程。例如，将一个三维数组 [[[1, 2], [3, 4]], [[5, 6], [7, 8]]] 扁平化后得到的是一个一维数组 [1, 2, 3, 4, 5, 6, 7, 8]。

实现方法

方法一：使用递归实现

首先，我们可以使用递归的方式来实现数组扁平化。具体实现代码如下：

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

上述代码中，flatten 函数接收一个多维数组作为参数，遍历该数组，如果当前遍历到的元素是数组，那么就递归调用 flatten 函数继续扁平化该数组，最终将扁平化后的数组与 res 数组合并；否则，将当前遍历到的元素直接 push 到 res 数组中。

方法二：使用 reduce 方法实现

除了使用递归的方式，我们还可以使用数组的 reduce 方法来实现数组扁平化。具体实现代码如下：

function flatten(arr) {
  return arr.reduce((prev, next) => {
    return prev.concat(Array.isArray(next) ? flatten(next) : next);
  }, []);
}

上述代码中，flatten 函数使用 reduce 方法遍历多维数组 arr，对于每一个元素 next，如果它是一个数组，则递归调用 flatten 函数将其扁平化，否则直接将元素 next push 到前面的 prev 数组中。

示例说明

示例一

我们定义一个二维数组：

const arr = [[1, 2], [3, [4, 5]]];

使用递归的方式将该数组扁平化：

const result = flatten(arr);
console.log(result); // [1, 2, 3, 4, 5]

使用 reduce 方法将该数组扁平化：

const result = flatten(arr);
console.log(result); // [1, 2, 3, 4, 5]

示例二

我们定义一个三维数组：

const arr = [[[1, 2], [3, 4]], [[5, 6], [7, [8, 9]]]];

使用递归的方式将该数组扁平化：

const result = flatten(arr);
console.log(result); // [1, 2, 3, 4, 5, 6, 7, 8, 9]

使用 reduce 方法将该数组扁平化：

const result = flatten(arr);
console.log(result); // [1, 2, 3, 4, 5, 6, 7, 8, 9]

通过以上两个示例，我们可以看到，使用递归和 reduce 方法都可以有效地将多维数组扁平化为一维数组。