将属性添加到对象数组

IT技术 javascript arrays object underscore.js
2021-02-08 18:38:04

我有一个对象数组,如下所示

Object {Results:Array[2]}
     Results:Array[2]
[0-1]
0:Object
       id=1     
       name: "Rick"
1:Object
       id=2     
       name:'david'

我想再向这个对象数组的每个元素添加一个名为 Active 的属性。

最终结果应该如下。

Object {Results:Array[2]}
     Results:Array[2]
[0-1]
0:Object
       id=1     
       name: "Rick"
       Active: "false"
1:Object
       id=2     
       name:'david'
       Active: "false"

有人可以让我知道如何实现这一目标。

6个回答

或使用 map

Results.map(obj=> ({ ...obj, Active: 'false' }))

编辑以反映@adrianolsk 的评论,不改变原始对象,而是为每个对象返回一个新对象。

阅读规范

ES5 准确地说 ;) - 但 babel 会很乐意反编译它
2021-03-19 18:38:04
很好的解决方案@adrianolsk,您应该将其作为单独的答案提交。
2021-04-04 18:38:04
仅在 ES6 中支持
2021-04-06 18:38:04
map 应该返回一个不改变对象的新数组,在这种情况下 forEach 会更好,或者使用 map 并返回一个新对象 Results.map(obj=> ({ ...obj, Active : 'false' }))
2021-04-08 18:38:04

您可以使用该forEach方法为数组中的每个元素执行一次提供的函数。在此提供的函数中,您可以将Active属性添加到元素。

Results.forEach(function (element) {
  element.Active = "false";
});
为了完成起见,有些人发现函数参数的重新分配是不好的做法:eslint.org/docs/rules/no-param-reassign当它像这样简单和孤立时,对我来说很好。
2021-03-23 18:38:04

使用 ES6,您可以简单地执行以下操作:

 for(const element of Results) {
      element.Active = "false";
 }

我也遇到了这个问题,在试图解决它的过程中,我一直在运行我的应用程序的 chrome 选项卡崩溃。看起来对象的扩展运算符是罪魁祸首。

在 adrianolsk 的评论和上面 sidonaldson 的回答的帮助下,我使用了Object.assign()来自 babel 的扩展运算符的输出,如下所示:

this.options.map(option => {
  // New properties to be added
  const newPropsObj = {
    newkey1:value1,
    newkey2:value2
  };

  // Assign new properties and return
  return Object.assign(option, newPropsObj);
});
  Object.defineProperty(Results, "Active", {value : 'true',
                       writable : true,
                       enumerable : true,
                       configurable : true});
使用 Object.defineProperty 定义动态属性。
2021-03-26 18:38:04