时间戳

首页 > 解决方案 > 如何从复杂的数组对象结构中获取数据？

javascript - 如何从复杂的数组对象结构中获取数据？

问题描述

我有这样一个对象

data: {
      dataFirst: { 
        Food: [ {id: 536131, name: "option1", }]
      },       
      dataSecond: { 
        Autos: [{id: 678, name: 'option1'}],
        Houses: [
          {id: 6876, name: "option1"},
          {id: 6876, name: "Placed App"},
        ],
        Phones: [
          {id: 672, name: "option1"},
          {id: 97249, name: "Placed},
        ],
        Food: [
          {id: 772, name: "option1"},
          {id: 6777, name: "Placed},
        ], 
      }
    }

问题是，我可能在 dataFirst 和 dataSecond 中有相同的数据，例如“Food”，我有 2 个包含不同数据的数组对象，但我需要使用其中 2 个的数据将其设为一个对象“Food”，来自dataFirst '食物' 和 dataSecond '食物'。我有这样的代码：

export const parser = ({ data }) => {
  const result = Object.values(data).reduce((prev, topicsGroup) => {
    Object.assign(prev, topicsGroup);
    return prev;
  }, {});
  return result;
}

但是这段代码没有合并 2 个“食物”对象，而是仅从 dataFirst 的“食物”对象返回数据，而没有第二个对象。

标签： javascriptreactjs

解决方案

您可以通过连接对应于公共键的数组来遍历主数据对象的所有值Object.values(data)并将它们组合起来：reduce

let data = {
  dataFirst: {
    Food: [{
      id: 536131,
      name: "option1",
    }]
  },
  dataSecond: {
    Autos: [{
      topicId: 678,
      name: 'option1'
    }],
    Houses: [{
        topicId: 6876,
        name: "option1"
      },
      {
        topicId: 6876,
        topicName: "Placed App"
      },
    ],
    Phones: [{
        topicId: 672,
        name: "option1"
      },
      {
        topicId: 97249,
        name: "Placed"
      },
    ],
    Food: [{
        topicId: 772,
        name: "option1"
      },
      {
        topicId: 6777,
        name: "Placed"
      },
    ],
  }
};


let res = Object.values(data).reduce((acc, curr) => {
  Object.entries(curr).forEach(([k, v]) => {
    if (k in acc) acc[k] = acc[k].concat(v);
    else acc[k] = v;
  });
  return acc;
}, {});

console.log(res);

推荐阅读