如何在ES6中将数组对象的id、name改为value、label？

数据老陈

2026-5-15

用ES6转换数组对象属性名的简洁方案

这事儿用ES6的Array.prototype.map()就能轻松搞定，简直是为这种数组元素转换量身定做的！它会遍历原数组的每个对象，返回一个全新的转换后数组，完全不会改动原数据，非常符合现代JS的纯函数编程风格。

直接上代码示例，一看就明白：

// 你的原始数组
const originalStores = [
  { id: 1, name: 'lopd' },
  { id: 2, name: 'abc' }
];

// 用map完成属性名转换
const transformedStores = originalStores.map(store => ({
  value: store.id,
  label: store.name
}));

console.log(transformedStores);
// 输出结果正好是你要的：
// [ { value: 1, label: 'lopd' }, { value: 2, label: 'abc' } ]

几个容易踩坑的小细节：

箭头函数里直接返回对象时，一定要给对象加括号({ ... })，不然JS会把花括号当成函数的代码块，就不是返回对象了，这点新手很容易出错！
如果原对象还有其他额外属性需要保留（比如每个store有address字段），可以结合对象解构和展开运算符处理，既替换目标属性，又保留其他属性：
```
const transformedStores = originalStores.map(({ id, name, ...restProps }) => ({
  value: id,
  label: name,
  ...restProps // 把其他所有属性都展开进来
}));
```
这种方式是不可变的，原数组originalStores不会被修改。如果非要修改原数组（不推荐，尽量保持数据不可变），可以用forEach循环，但显然map的写法更优雅简洁。