json 基于重复属性值重构对象数组

beq87vna  于 2022-12-15  发布在  其他
关注(0)|答案(2)|浏览(103)

我有一个对象数组

rows = [
    {
      id_temp: 1,
      description: 'template 1',
      color_id: 1,
      code: '#000000'

   },
    {
      id_temp: 1,
      description: 'template 1',
      color_id: 2,
      code: '#ffffff'

    },
   {
      id_temp: 2,
      description: 'template 2',
      color_id: 1,
      code: '#000000'

    },
   {
      id_temp: 2,
      description: 'template 2',
      color_id: 2,
      code: '#ffffff'

    },
]

我需要将其转换为该形状,添加颜色属性作为对象数组,该对象数组由基于重复id_temp的每次迭代的代码和id组成

[{
    "id_temp": 1,
    "description": "template 1",
    "color": [{
        "id": 1
        "code": "#000000"
         },
        {
        "id": 2
        "code": "#ffffff"
        }]
},
{
    "id_temp": 2,
    "description": "template 2",
    "color": [{
        "id": 1
        "code": "#000000"
    },
    {
      "id": 2
      "code": "#ffffff"
    }]
}]

我尝试在foreach中循环它,但这会导致覆盖新数组中的值

let resultTemplates = [];
rows.forEach((row) => {
        if (resultTemplates[row.id_temp]) {
          resultTemplates['color'] = row.color_id;
          resultTemplates['color'] = row.code;
        } else {
          resultTemplates.id_temp = row.id_temp;
          resultTemplates.description = row.description;
          resultTemplates['color'].id = row.color_id;
          resultTemplates['color'].code = row.code;
        }
        });
41zrol4v

41zrol4v1#

使用Reduce方法

const rows = [
    {
        id_temp: 1,
        description: "template 1",
        color_id: 1,
        code: "#000000",
    },
    {
        id_temp: 1,
        description: "template 1",
        color_id: 2,
        code: "#ffffff",
    },
    {
        id_temp: 2,
        description: "template 2",
        color_id: 1,
        code: "#000000",
    },
    {
        id_temp: 2,
        description: "template 2",
        color_id: 2,
        code: "#ffffff",
    },
];

const outArr = rows.reduce((acc, crt) => {
    if (!acc[crt.id_temp]) {
        crt["color"] = [
            {
                id: 1,
                code: crt.code,
            },
        ];
        acc[crt.id_temp] = crt;
    } else {
        acc[crt.id_temp].color.push({ id: acc[crt.id_temp].color.length +1, code: crt.code });
    }

    return acc;
}, {});

console.log(Object.values(outArr));
qybjjes1

qybjjes12#

一个基于reduce的精益(在代码和抽象方面)实现在函数体中使用destructuring assignments作为函数参数和变量赋值,它也利用了rest属性。

function groupCreateAndCollectNewItemsByTemplateId(
  index, { color_id, code, ...itemRest }
) {
  const { id_temp: groupKey } = itemRest;

  // ... more code ...
}

并且为了表达分组项目的创建和/或访问以及已经创建/分组的项目的聚集,可以选择Nullish Coalescing Assignment Operator/??=

(index[groupKey] ??= { ...itemRest, color: [] })

index是一个通过减少OP的rows数组以编程方式聚合的对象。它是新创建的分组项的根对象,其中rows项的id_temp值用作分组键。
在最后一步中,需要将简化的中间分组对象传递到Object.values,以便获得分组对象的值的数组,这些值是新创建的模板项。
一个二个一个一个

相关问题