【问题标题】:Extract data from array of objects (Slightly complicated issue)从对象数组中提取数据(稍微复杂的问题)
【发布时间】:2017-07-14 20:44:32
【问题描述】:

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

Array[0-2]
   0: Object
           Name: 'Rick'
           City: 'Sunnyvale'
           FactorJSONMap: "{"Id":"234","Country":"USA"}"
   1: Object
           Name: 'Diana'
           City: 'Santa Clara'
           FactorJSONMap: "{"Id":"124","Country":"USA"}"
   2: Object
           Name: 'Thiago'
           City: 'New Jeresy'
           FactorJSONMap: "{"Id":"673","Country":"USA"}"

我能够正确地遍历元素“名称”和“城市”。 但是有一个元素“FactorJSONMap”。这是来自数据库。我一般无法遍历这个。

任何人都可以告诉我是否有办法将上述格式的数据转换为以下格式。

请注意。 FactorJSONMap 是动态的,可以有不同的元素。这里目前有“Id”和“City”。它可以有“Id”、“City”和“Sex”。

有没有办法我可以提取上面的数据并转换成这个简单的对象数组形式。

Array[0-2]
   0: Object
           Name: 'Rick'
           City: 'Sunnyvale'
           Id: '234'
           Country:'USA'
   1: Object
           Name: 'Diana'
           City: 'Santa Clara'
           Id: '124'
           Country:'USA'
   2: Object
           Name: 'Thiago'
           City: 'New Jeresy'
           Id: '673'
           Country:'USA'

【问题讨论】:

  • 你试过解析 JSON 吗? JSON.parse(json).
  • @AndrewLi-当它已经在对象数组中时我该如何解析?
  • JSON.parse(array[0].FactorJSONMap) 或者当你迭代它时,例如array.forEach(obj => { const map = JSON.parse(obj.FactorJSONMap) })?
  • 但这仅适用于 FactorJSONMap。?我怎样才能将它添加到对象数组中,然后迭代所有对象?
  • 我认为您需要展平对象。查看此内容以供参考stackoverflow.com/questions/8750362/…

标签: javascript angularjs arrays object underscore.js


【解决方案1】:

您可以简单地使用 JSON 对象的 parse 方法将 FactorJSONMap 中的数据获取为对象格式,然后将其分配给数组中的父对象。遍历数组中的所有对象后,返回的对象数组将包含第一级中列出的所有嵌套属性。

https://jsfiddle.net/4h72h6b8/3/

function traverseData(data) {
  for(let data_obj of data) {
  Object.assign(data_obj, JSON.parse(data_obj.FactorJSONMap));
  delete data_obj.FactorJSONMap;
  }
  return data;
};

在示例中,您将在控制台日志中看到结果。

【讨论】:

  • 能不能也分享一下分配和删除功能的知识。我从来没有在javascript中遇到过这个。但这很好用。谢谢。
  • 当您使用 Object.assign(target, object) - 如果目标对象中的属性具有相同的键,它们将被源中的属性覆盖。稍后来源的属性将类似地覆盖较早的来源。 delete 只是一个从 Object 中删除属性的关键字。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-05-01
  • 1970-01-01
  • 2019-10-11
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多