时间戳

首页 > 解决方案 > 如何对数组键值进行分组

javascript - 如何对数组键值进行分组

问题描述

我收到如下 API 响应

[{id: 1, fileName:"abc.png",docid:"123",controlNumb:"11"},
{id:2,fileName:"mno.png",docid:"121",controlNumb:"12"},
{id:1,fileName:"def.png",docid:"120",controlNumb:"11"},
{id:3,fileName:"xyz.png",docid:"125",controlNumb:"13"},
{id:2,fileName:"rst.png", docid:"126",controlNumb:"12"}]

我想转换成什么

[{id: 1, fileName:["abc.png",def.png],docid:["123","120"],controlNumb:"11"},
{id: 2, fileName:["mno.png",rst.png],docid:["121","126"],controlNumb:"12"}
{id: 3, fileName:["xyz.png"],docid:["125"],controlNumb:"11"}

我尝试了 .reduce 方法，它给出了相同的输出，但 fileName 和 type 显示的对象我不能使用映射到这些键。

如果 id 为空，我想按 controlNumb 分组

下面的代码，我试过

 let newDirectory = Object.values(
       this.state.data.reduce((acc, item) => {
         if (!acc[item.id])
          acc[item.id] = {
           id: item.id,
           controlNumb: item.controlNumb,
            docid: [],
            fileName: [],
          };
         acc[item.id].docid.push(item.docid);
         acc[item.id].fileName.push(item.fileName);
         return acc;
       }, {})
     );
     console.log("newDirectory", newDirectory);

上面的代码返回数组，但它的对象类型，所以我不能在文件名中使用 map

标签： javascriptarraysreactjs

解决方案

U 可以遍历数据，并根据相同的值对值进行分组，然后将和id的属性扩展为，例如：fileNamedocidarrays

const data = [{ id: 1, fileName: "abc.png", docid: "123", controlNumb: "11" },
{ id: 2, fileName: "mno.png", docid: "121", controlNumb: "12" },
{ id: 1, fileName: "def.png", docid: "120", controlNumb: "11" },
{ id: 3, fileName: "xyz.png", docid: "125", controlNumb: "13" },
{ id: 2, fileName: "rst.png", docid: "126", controlNumb: "12" }];

const parsedData = [];

for (const item of data) {
  const index = parsedData.findIndex(storedItem => storedItem.id === item.id);
  if (index === -1) {
    const newItem = { ...item, fileName: [item.fileName], docid: [item.docid] }
    parsedData.push(newItem);
    }
  else {
    parsedData[index].fileName.push(item.fileName);
    parsedData[index].docid.push(item.docid);
  }
}

console.log(parsedData);

推荐阅读