如何用ES6优雅实现JavaScript对象数组转值分组数组

嘿，这里有几个更简洁优雅的ES6方案来替代你当前冗长的实现，完美适配你的需求：

方案1：动态适配任意属性（灵活通用） #

如果你的对象属性可能会变化，或者想写一个通用的转换逻辑，这个方法会很合适。我们可以先提取对象的键，再通过map遍历每个键来收集对应的值：

const src = [{x:1,y:'a'},{x:2,y:'b'}];
// 提取第一个对象的属性键（假设所有对象结构一致）
const keys = Object.keys(src[0]);
// 遍历每个键，收集对应属性值组成子数组
const desc = keys.map(key => src.map(item => item[key]));

这个方法的好处是无需硬编码属性名，哪怕后续对象新增了其他属性，代码也能自动适配生成对应的子数组。

方案2：属性明确时的极简写法（直观高效） #

如果你的对象属性固定就是x和y，可以直接用解构赋值结合map，写法更直观：

const src = [{x:1,y:'a'},{x:2,y:'b'}];
const desc = [
  src.map(({ x }) => x),
  src.map(({ y }) => y)
];

这里通过对象解构直接取出每个元素的x和y值，一步生成对应的子数组，代码简洁易懂，性能也很出色。

对比原代码的优势 #

两种方案都避免了手动声明临时数组和forEach里的push操作，用ES6的数组方法实现了声明式编程，代码更简洁、可读性更强，也符合现代JS的写法习惯。

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