javascript - 如何将对象数组转换为嵌套对象数组？

Question

我有一个具有以下结构的对象数组:

var items = [
  {
    attributes: [
      {
        type: "Size",
        value: "Small"
      },
      {
        type: "Color",
        value: "Black"
      }
    ]
  },
  {
    attributes: [
      {
        type: "Size",
        value: "Small"
      },
      {
        type: "Color",
        value: "White"
      }
    ]
  },
  {
    attributes: [
      {
        type: "Size",
        value: "Medium"
      },
      {
        type: "Color",
        value: "Black"
      }
    ]
  },
  {
    attributes: [
      {
        type: "Size",
        value: "Medium"
      },
      {
        type: "Color",
        value: "White"
      }
    ]
  }
];

我的目标是提取具有相同“类型”的所有“值”属性。例如，类型“Size”具有以下值:Small、Medium。之后，我想创建一个具有以下结构的新列表:

 var results = [
  {
    type: "Size",
    values: ["Small", "Medium"]
  },
  {
    type: "Color",
    values: ["White", "Black"]
  }
];

这是我当前的代码:

var results = items.map((item, index) => {
  return item.attributes.map(attribute => {
    let value = [];
    value.push(attribute.value);
    return {
      type: attribute.type,
      value: attribute.value
    };
  });
});

Answer 1

您可以使用reduce和Set

• 首先循环遍历 items 数组
• 对于每个属性，我们将 type 映射为最终对象上的键，并将值添加到相应的键，因为我们只想保留唯一值，因此我们使用 Set
• 现在我们的最终结果看起来像 {type: { type, value }} 但我们所需的格式是 { type, size} 所以我们使用 Object.values () 从 final 获取 {type, value}，然后我们将其映射为所需的格式

var items = [{attributes: [{type: "Size",value: "Small"},{type: "Color",value: "Black"}]},{attributes: [{type: "Size",value: "Small"},{type: "Color",value: "White"}]},{attributes: [{type: "Size",value: "Medium"},{type: "Color",value: "Black"}]},{attributes: [{type: "Size",value: "Medium"},{type: "Color",value: "White"}]}];


let final = items.reduce((op, {attributes}) => {
  attributes.forEach(({type, value}) => {
    op[type] = op[type] || {type, value: new Set()}
    op[type].value.add(value)
  })
  return op
},{})

let output = Object.values(final).map(({type, value}) => ({type, value:[...value]}))

console.log(output)