ES6 JavaScript中更新现有的对象数组

Question

我是ES6 JavaScript的初学者。我正在寻找一个场景，可以更新来自Web服务的对象数组，并将数据格式传递给表格。

我正在使用ReactJS的'rc-table'。

https://www.npmjs.com/package/rc-table

为了在rc-table中显示我们的数据，我们需要从后端获取一个带有属性键“somevalue”的数据。我的数据格式如下：

```html

要在rc-table格式中显示我们的数据，我们需要在来自后端的数据中具有一个属性键：“somevalue”。

我的数据格式如下：

```

{
 {
   Name:'Robert',
   City: 'Barcelona'
 },
 {
   Name: 'Marguaritte',
  City: 'Baltimore'

 }
}

现在它将以rc-table格式显示，前提是对象具有唯一的键属性。

例如：

 {
 {
  Name:'Robert',
  City: 'Barcelona',
   Key:1
 },
 {
  Name: 'Marguaritte',
  City: 'Baltimore',
  Key:2

  }
 }

我想更新我的对象，使用'key:1'和'key:2'

附上我的代码，希望得到帮助。

- mohan babu

---

有点混乱。您能否展示一下您需要的期望输出？ - Akshay Khandelwal

ES6 中没有任何东西可以使这更容易。您可以使用在 ES5 中使用过的任何解决方案。 - Felix Kling

Answer 1

你的实际数组格式不正确，应该用 [] 替换包裹的 {}，这样才是有效的数组。

无论如何，你应该使用 Array.prototype.map()，它将返回一个自定义数组，使用回调函数添加 key 属性到每个迭代的项。

代码应该写成这样：

var data = arr.map(function(item, index) {
  item.key = index + 1;
  return item;
});

ES6 解决方案：

根据Chester Millisock在评论中提出的建议，使用ES6 箭头函数：

var data = arr.map((item, index) => {
   item.key = index + 1;
   return item;
}); 

演示：

var arr = [{
    Name: 'Robert',
    City: 'Barcelona'
  },
  {
    Name: 'Marguaritte',
    City: 'Baltimore'

  }
];

var data = arr.map((item, index) => {
   item.key = index + 1;
   return item;
}); 

console.log(data);

- cнŝdk

---

由于OP表示自己是ES6的新手，我建议OP学习使用箭头函数来完成这个任务（见下文）。 - Chester Millisock Jr

Answer 2

我认为你想要做类似于这样的事情。我假设你的数据是对象数组，而不是像你提出的没有键的对象。

const data = data.map((el, index) => {
    el.Key = index;
    return el;
});

- Chester Millisock Jr

---

你仍然需要返回 el，否则它将是一个由 undefined 组成的数组，不是吗？ - Rob M.

实际上 index 从 0 开始，所以我们需要使用 index+1，这将始终将 undefined 推入结果数组中。 - cнŝdk

是的，你需要返回 el。索引从0开始。我假设0是rc-table的有效键。 - Chester Millisock Jr