更改数组中对象参数的名称答案

【问题标题】：change names of object parameters in array更改数组中对象参数的名称
【发布时间】：2018-01-09 13:21:49
【问题描述】：

假设我有以下数组结构：

"stores" : [
    {
        id: 1,
        name: 'lopd',
    },
    {
        id: 2,
        name: 'abc'
    }
]

我想将参数名称更改为：

"stores" : [
    {
        value: 1,
        label: 'lopd',
    },
    {
        value: 2,
        label: 'abc'
    }
]

我将如何在 ES6 中做到这一点？

【问题讨论】：

你喜欢保留对象和数组，还是可以是一个带有新对象的新数组？
@NinaScholz 带有新对象的新数组有效，仅用于演示目的

标签： javascript arrays object ecmascript-6

【解决方案1】：

您可以将destructuring ~~assignment~~ 与object property assignment pattern 和short hand properties 一起使用。

var stores = [{ id: 1, name: 'lopd' }, { id: 2, name: 'abc' }];

stores = stores.map(({ id: value, name: label }) => ({ value, label }));

console.log(stores);

【讨论】：

【解决方案2】：

您可以使用map 函数执行以下操作：

let example = {
  "stores" : [
   {
    id: 1,
    name: 'lopd',
   },
   {
    id: 2,
    name: 'abc'
   }
  ]
}

let answer = example.stores.map(item => {
   return {
     value: item.id,
     label: item.name
  }
})

console.log(answer)

【讨论】：

【解决方案3】：

为了完整起见，虽然我实际上会使用Nina's answer：如果你想实际修改原始对象，你可以创建新属性和delete要丢弃的那些。

var obj = {
  stores: [{
      id: 1,
      name: 'lopd',
    },
    {
      id: 2,
      name: 'abc'
    }
  ]
}
console.log(obj.stores);
obj.stores.forEach(function(val) {
  val.value = val.id;
  val.label = val.name;
  delete val.id;
  delete val.name;
});
console.log(obj.stores);

这可能并不重要（或者在大多数情况下），但这是保留原始对象的唯一方法。其他解决方案将数组中的整个对象替换为新对象...

另外：这是 ES5，所以它可以在旧版浏览器（即 IE9）中运行

【讨论】：

【解决方案4】：

您也可以使用以下方法创建一个新数组：

示例：

var data = [{id: 1, name: 'lopd'}, {id: 2, name: 'abc'}];
    
var result = Array.from(data, obj => ({value: obj.id, label: obj.name}));

console.log(result);

【讨论】：