使用map生成子数组后，如何更简洁合并为一个主数组？

嘿，这个场景太常见了！确实不用麻烦地先声明空数组再一个个push，有好几种更简洁的方式，既减少代码量又提升可读性：

1. 扩展运算符（...）——最直观的写法 #

扩展运算符可以直接把数组的元素“展开”到新数组里，一步就能合并多个子数组：

如果你已经有单独的子数组变量： #

const temp = obj.data.map(a => a.temp);
const air = obj.data.map(a => a.air);

// 一行合并成一维数组
const OneArrayToRuleThemAll = [...temp, ...air];

甚至可以一步到位，不用单独定义子数组： #

const obj = { data: [ { temp: 1, air: 2, cloud: 3 }, { temp: 100, air: 101, cloud: 102 } ] };

const OneArrayToRuleThemAll = [
  ...obj.data.map(a => a.temp),
  ...obj.data.map(a => a.air)
];
// 结果：[1, 100, 2, 101]

2. Array.concat()——传统但可靠的方法 #

concat方法本身就是用来合并数组的，它会返回一个新数组，不会修改原数组：

已有子数组变量的情况： #

const temp = obj.data.map(a => a.temp);
const air = obj.data.map(a => a.air);

const OneArrayToRuleThemAll = temp.concat(air);

一步到位写法： #

const OneArrayToRuleThemAll = obj.data.map(a => a.temp)
  .concat(obj.data.map(a => a.air));

如果后面要加更多子数组（比如cloud数组），直接在concat里继续传参数就行：temp.concat(air, cloud)，非常灵活。

补充：关于你原来的push写法 #

顺便提一句：你原来写的OneArrayToRuleThemAll.push(temp, air)会得到一个二维数组（[[1,100], [2,101]]），如果你的目标是把所有元素扁平化到一个一维数组里，这个写法其实不符合预期。如果一定要用push，得改成OneArrayToRuleThemAll.push(...temp, ...air)——但显然这比上面两种方法啰嗦多了，完全没必要。

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