如何在JavaScript中动态合并嵌套数组？附实例需求

嘿，这事儿好办！你想要把那个嵌套了一层的数组拆平，把所有元素都放到同一个一维数组里对吧？我给你几个简单的解决方案：

首先先看你的原始数组：

var series = [ [{ Name: "A", Type: "SC" }, { Name: "B", Type: "SC" }, { Name: "C", Type: "SC" }, { Name: "D", Type: "SC" }], { ColumnName: "Target", Type: "Line" }, { ColumnName: "bar", Type: "Line" } ];

方法1：使用concat+扩展运算符 #

这个方法利用concat可以合并多个数组/元素的特性，再用扩展运算符把第一个子数组的元素展开：

// 直接合并并重新赋值给series
series = [].concat(...series);

执行后，series就变成了你想要的一维数组啦。

方法2：使用flat()方法（最简洁） #

ES6+提供的flat()方法专门用来扁平化数组，默认只会扁平化一层，刚好匹配你的场景：

series = series.flat();

一行代码搞定，非常清爽！

方法3：手动遍历（兼容旧环境） #

如果需要兼容像IE这类不支持ES6+语法的旧环境，可以手动遍历数组来合并：

var mergedSeries = [];
for (var i = 0; i < series.length; i++) {
  const item = series[i];
  if (Array.isArray(item)) {
    // 如果是数组，就把里面的元素逐个加进去
    mergedSeries.push(...item);
  } else {
    // 如果是单个对象，直接添加
    mergedSeries.push(item);
  }
}
series = mergedSeries;

不管用哪种方法，最终你都会得到想要的结果：

var series = [ { Name: "A", Type: "SC" }, { Name: "B", Type: "SC" }, { Name: "C", Type: "SC" }, { Name: "D", Type: "SC" }, { ColumnName: "Target", Type: "Line" }, { ColumnName: "bar", Type: "Line" } ];

内容的提问来源于stack exchange，提问作者Harsh