更改对象数组中的键名？

Question

如何在对象数组中更改键名？

var arrayObj = [{key1:'value1', key2:'value2'},{key1:'value1', key2:'value2'}];

我该如何将每个key1更改为stroke，以便得到：

var arrayObj = [{stroke:'value1', key2:'value2'},{stroke:'value1', key2:'value2'}];

- John Cooper

---

几年后，与目前被接受的答案不同，你可以使用map，并像这个回答和这个回答一样使用箭头函数。 - T.J. Crowder

Answer 1

在最近的JavaScript（和TypeScript）中，使用剩余语法解构, 扩展语法, 和 数组map来替换对象数组中的一个关键字符串。

const arrayOfObj = [{
  key1: 'value1',
  key2: 'value2'
}, {
  key1: 'value1',
  key2: 'value2'
}];
const newArrayOfObj = arrayOfObj.map(({
  key1: stroke,
  ...rest
}) => ({
  stroke,
  ...rest
}));

console.log(newArrayOfObj);

- Marcus

---

扩散是可选的，只有当您想要在数组中保留旧值时才需要使用它。好答案，真的很整洁和强大。 - Alex Beugnet

如何使“笔画”动态地传递给映射函数？ - Prashant

@Prashant，好问题（如何动态传递 'stroke'）！以下代码是否适用于您？const newKey = 'stroke'; const newArrayOfObj = arrayOfObj.map(({ key1, ...rest }) => ({ [newKey]: key1, ...rest }));这段代码会将一个名为 arrayOfObj 的对象数组，通过将其每个对象的 key1 属性映射到一个新的属性名为 stroke 的对象中来创建一个新的对象数组 newArrayOfObj。 - Marcus

注意，这并不是替换任何内容。它创建一个带有新属性名称的新数组。 - jfriend00

这个能否用于嵌套属性，例如 const arrayOfObj = [{attributes: { key1: 'value1', key2: 'value2' }}, {attributes: { key1: 'value1', key2: 'value2' }}];？ - Jerry

Answer 2

var i;
for(i = 0; i < arrayObj.length; i++){
    arrayObj[i].stroke = arrayObj[i]['key1'];
    delete arrayObj[i].key1;
}

- Paul

---

你可以在这里看到：http://jsfiddle.net/Paulpro/XVxvy/2/ 它会弹出 "undefined" 然后是 "value1"。 - Paul

谢谢您提供的解决方案，但如果对象具有动态键怎么办？例如：var arrayObj = [{abcKey,'value1', acdKey:'value2',defKey:'value3', cfgKey:'value4'}]; - Dhaval

它移除了密钥，我该怎么办 :( - Freddy Sidauruk

Answer 3

ES6 map() 方法:

let arrayObj = [{key1:'value1', key2:'value2'},{key1:'value1', key2:'value2'}];

arrayObj = arrayObj.map(item => {
  return {
    stroke: item.key1,
    key2: item.key2
  };
});
    
console.log("arrayObj = " + JSON.stringify(arrayObj));

- alex351

---

但是您需要知道对象中的所有键，并将它们每个都写入返回的对象中。 - Omkar

你不需要知道所有的键，只需使用扩展运算符即可，如下所示： var arrayObj = [{key1:'value1', key2:'value2'},{key1:'value1', key2:'value2'}];arrayObj = arrayObj.map(item => { return { ...item, key2: item.key2 }; }); - Gautam

但这也保留了旧的键。 - Dariusz Legizynski

不要这样想，试着运行代码片段。 - alex351

Answer 4

你无法更改属性名称，你必须使用新名称添加值并删除旧属性：

for (var i = 0; i < arrayObj.length; i++) {
  arrayObj[i].stroke = arrayObj[i].key1;
  delete arrayObj[i].key1;
}

- Guffa

---

所有浏览器版本都支持 delete 吗？ - Jared Farrish

是的，它是Javascript语言的一部分。 - Guffa

好的，出于某种原因，我认为它不受某些版本的IE支持或其他什么。 - Jared Farrish

Answer 5

只需一行 ES6 代码

尝试以下代码：

arrayObj.map(({ stroke, key2 }) => ({ yourNewKey: stroke, yourNewKey2: key2 }));

- jayesh sheta

Answer 6

const company =  [{ id:"1", name:"somename"},{ id:"1", name:"somename"}]

company.map(({ id, name }) => ({ companyId: id, companyName: name }));

// output
//[{ companyId:"1", companyName:"somename"},{ companyId:"1", //companyName:"somename"}]

- Ashif Zafar

Answer 7

不要更改键名。如果需要，你可以先赋予新的键名和值，然后再删除之前的键。以你的示例为例：

var arrayObj = [{key1,'value1', key2:'value2'},{key1,'value1', key2:'value2'}];
var o = arrayObj[0];   // get first object
var val = o.key1;      // get current value
o.stroke = val;        // assign to new key
delete o.key1;         // remove previous key

如果您想对主数组中的所有对象进行此操作，只需将其放入循环中，遍历数组内容即可。这里我加入了更多的中间变量来记录正在进行的操作，以便更好地说明问题。

或者在循环中使用缩短版：

for (var i = 0; i < arrayObj.length; i++) {
    var o = arrayObj[i];
    o.stroke = o.key1;
    delete o.key1;
}

- jfriend00

---

谢谢。尽管我很喜欢ES5/6，但我不得不在Google标签管理器中使用原生JS来完成这个任务。 - lharby

@lharby - 这已经是原生的 JavaScript 了。这可以在 ES3 中工作。 - jfriend00

这就是我所说的，一些较新的ES5/6功能在GTM中不受支持。谢谢。 - lharby

Answer 8

function changeKey(originalKey, newKey, arr)
{
  var newArr = [];
  for(var i = 0; i < arr.length; i++)
  {
    var obj = arr[i];
    obj[newKey] = obj[originalKey];
    delete(obj[originalKey]);
    newArr.push(obj);
  }
  return newArr;
}

- Pablo Fernandez

Answer 9

pure javascript

var array=[{oldkey:'oldkeyvalue',oldkey2:'oldkey2'}]
var result=array.map(({ oldkey: newkey, ...rest }) => ({ newkey, ...rest }));
console.log(result)

lodash或underscore js

//Lodash/underscore.js
_.map(array,(({ oldkey: newkey, ...rest }))=>({ oldkey: newkey, ...rest }))

上述技术无法设置字符串名称。

例如：全名或姓氏。

错误的方式：

name:full name

正确的方法

name:full_name

你可以使用 map 方法以同样的方式获得字符串对象

array.map((x)=>{
var y={};
//also use spread operator if necessary but key want to remove manually

y['full name']=x['name'];
return y;
})

- Balaji

Answer 10

另一个选择是当您有其他数组时，它们具有不同键名的对象，并且您的对象具有相等的大小。

function convertKeys (arr) {
  const newFormat = arr.map((value) => {
    const arrFormat = Object.values(value)
    return {
      newKey1: arrFormat[0],
      newKey2: arrFormat[1]
    }
  })
}

在 array.map 中，我将对象转换为数组，并通过它们的索引获取值。

- AbnerLR-014

---

欢迎来到SO。请用文字形式解释您的答案，并告诉我们它是如何工作的，以及与其他给出的答案有何不同之处。 - ahuemmer