how to make a single level array of objects into an array of nested objects

Question

what i have is a single level array of objects

data = [ 
  {"id": 1, "catTitle": "Item1", "parentId": null },
  {"id": 2, "catTitle": "Item2", "parentId": null },
  {"id": 3, "catTitle": "Item3", "parentId": null },
  {"id": 4, "catTitle": "Item4", "parentId": 1 },
  {"id": 5, "catTitle": "Item5", "parentId": 1 },
  {"id": 6, "catTitle": "Item6", "parentId": 2 },
  {"id": 7, "catTitle": "Item7", "parentId": 2 },
  {"id": 8, "catTitle": "Item8", "parentId": 3 },
  {"id": 9, "catTitle": "Item9", "parentId": 5 },
  {"id": 10, "catTitle": "Item10", "parentId": 5 },
  {"id": 11, "catTitle": "Item11", "parentId": 7 },
  {"id": 12, "catTitle": "Item12", "parentId": 10 },
]

what i want is to convert the array into an array of objects with parent-child kind of relationship. Here the parentId of an item refers to the id of the parent item.

result = [
  {
    "id": 1,
    "catTitle": "Item1",
    "parentId": null,
    "childs": [{
        "id": 4,
        "catTitle": "Item4",
        "parentId": 1,
        "childs": []
      },
      {
        "id": 5,
        "catTitle": "Item5",
        "parentId": 1,
        "childs": [{
            "id": 9,
            "catTitle": "Item9",
            "parentId": 5
          },
          {
            "id": 10,
            "catTitle": "Item10",
            "parentId": 5,
            "childs": [{
              "id": 12,
              "catTitle": "Item12",
              "parentId": 10
            }]
          },
        ]
      },
    ]
  },
  .
  .
  .
]

Does this answer your question? How to create a hierarchical nested object based on parent-id or Convert array of objects with parent ids to a nested tree structure or Convert array of objects with parent / child relationships to array of nested objects... — Heretic Monkey
– Heretic Monkey, Commented Jun 23, 2023 at 16:24

Konrad · Accepted Answer · 2023-06-23 16:34:40Z

const data = [ 
  {"id": 1, "catTitle": "Item1", "parentId": null },
  {"id": 2, "catTitle": "Item2", "parentId": null },
  {"id": 3, "catTitle": "Item3", "parentId": null },
  {"id": 4, "catTitle": "Item4", "parentId": 1 },
  {"id": 5, "catTitle": "Item5", "parentId": 1 },
  {"id": 6, "catTitle": "Item6", "parentId": 2 },
  {"id": 7, "catTitle": "Item7", "parentId": 2 },
  {"id": 8, "catTitle": "Item8", "parentId": 3 },
  {"id": 9, "catTitle": "Item9", "parentId": 5 },
  {"id": 10, "catTitle": "Item10", "parentId": 5 },
  {"id": 11, "catTitle": "Item11", "parentId": 7 },
  {"id": 12, "catTitle": "Item12", "parentId": 10 },
]

const result = data.filter(item => item.parentId === null)

const queue = [...result]

while(queue.length) {
  const item = queue.shift()
  item.children = data.filter(i => i.parentId === item.id)
  queue.push(...item.children)
}

console.log(result)

Collectives™ on Stack Overflow

how to make a single level array of objects into an array of nested objects

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related