如果 projectId 匹配子项和 projectId 分组，则数据转换

Question

I need to group all the projectIds together and If the projectId is the same, the children should be together in the current item. Refer to the below picture for the expected final result.

Appreciate if anyone can help me on this. I'm trying to learn on the go while building functionality of an app. Thank you.

Current Json Format:

[
  {
    "projectIds": "1aa",
    "children": [
      {
        "email": "alyssayo@xxx.com",
        "permissionIds": null,
        "roleIds": [
          "raa",
          "baa",
          "caa"
        ],
        "projectIds": "1aa"
      }
    ]
  },
  {
    "projectIds": "3aa",
    "children": [
      {
        "email": "alyssayo@xxx.com",
        "permissionIds": null,
        "roleIds": [
          "raa",
          "baa",
          "caa"
        ],
        "projectIds": "3aa"
      }
    ]
  },
  {
    "projectIds": "1aa",
    "children": [
      {
        "email": "chiuewww@xxx.com",
        "permissionIds": null,
        "roleIds": [
          "baa",
          "caa"
        ],
        "projectIds": "1aa"
      }
    ]
  },
  {
    "projectIds": "2aa",
    "children": [
      {
        "email": "chiuewww@xxx.com",
        "permissionIds": null,
        "roleIds": [
          "baa",
          "caa"
        ],
        "projectIds": "2aa"
      }
    ]
  },
  {
    "projectIds": "3aa",
    "children": [
      {
        "email": "chiuewww@xxx.com",
        "permissionIds": null,
        "roleIds": [
          "baa",
          "caa"
        ],
        "projectIds": "3aa"
      }
    ]
  },
  {
    "projectIds": "1aa",
    "children": [
      {
        "email": "lalaqq@xxx.com",
        "permissionIds": null,
        "roleIds": [
          "caa"
        ],
        "projectIds": "1aa"
      }
    ]
  }
]

Expected Json Format:

const data = [
  {
    projectIds: "1aa",
    children: [
      {
        email: "alyssayo@xxx.com",
        permissionIds: null,
        roleIds: ["raa","baa","caa"],
        projectIds: "1aa",
      },
      {
        email: "chiuewww@xxx.com",
        permissionIds: null,
        roleIds: ["baa","caa"],
        projectIds: "1aa",
      },
      {
        email: "lalaqq@xxx.com",
        permissionIds: null,
        roleIds: ["caa"],
        projectIds: "1aa",
      }
    ]
  },
  {
    projectIds: "2aa",
    children: [
      {
        email: "chiuewww@xxx.com",
        permissionIds: null,
        roleIds: ["baa","caa"],
        projectIds: "2aa",
      }
    ]
  },
  {
    projectIds: "3aa",
    children: [
      {
        email: "alyssayo@xxx.com",
        permissionIds: null,
        roleIds: ["raa","baa","caa"],
        projectIds: "3aa",
      },    
      {
        email: "chiuewww@xxx.com",
        permissionIds: null,
        roleIds: ["baa","caa"],
        projectIds: "3aa",
      }
    ]
  }
];

Answer 1

u can use array reduce and array find,

 const data = [ { "projectIds": "1aa", "children": [ { "email": "alyssayo@xxx.com", "permissionIds": null, "roleIds": [ "raa", "baa", "caa" ], "projectIds": "1aa" } ] }, { "projectIds": "3aa", "children": [ { "email": "alyssayo@xxx.com", "permissionIds": null, "roleIds": [ "raa", "baa", "caa" ], "projectIds": "3aa" } ] }, { "projectIds": "1aa", "children": [ { "email": "chiuewww@xxx.com", "permissionIds": null, "roleIds": [ "baa", "caa" ], "projectIds": "1aa" } ] }, { "projectIds": "2aa", "children": [ { "email": "chiuewww@xxx.com", "permissionIds": null, "roleIds": [ "baa", "caa" ], "projectIds": "2aa" } ] }, { "projectIds": "3aa", "children": [ { "email": "chiuewww@xxx.com", "permissionIds": null, "roleIds": [ "baa", "caa" ], "projectIds": "3aa" } ] }, { "projectIds": "1aa", "children": [ { "email": "lalaqq@xxx.com", "permissionIds": null, "roleIds": [ "caa" ], "projectIds": "1aa" } ] } ] const findMatch = (arr, projectIds) => arr.find(item => item.projectIds === projectIds) const grouppingArray = (originalArr) => { return Array.isArray(originalArr)? originalArr.reduce((previousObj, obj) => { if (findMatch(previousObj, obj.projectIds)) { findMatch(previousObj, obj.projectIds).children.push(...obj.children) } else { previousObj.push(obj) } return previousObj }, []): 'Need an array' } console.log(grouppingArray(data))

Answer 2

You can try array.reduce() where initialData is your current data

const data = initialData.reduce(function (r, a) {
        r[a.projectIds] = r[a.projectIds] || [];
        r[a.projectIds].push(a);
        return r;
    }, Object.create(null));