Go 到 arrays 个对象，其中包含 arrays 个对象

Question

Backend sends an object that contains an array of objects. These objects contain more arrays of objects and so on. It resembles a tree.

I need to be able to go from one object to the other, following the array, and back. What would be the best way to do this in typescript?

I tried forEach, but I couldn't go back. For cycles inside of for cycles aren't an option either because sometimes there will be 2 levels of arrays, sometimes, 5. I thought of an iterator, but I don't know enough of angular/typescript to make it happen.

Here is a snippet of the data. This is a questionnaire and I need to show each question individually.

"questionId": 1,
"parent": null,
"description": "Question 1?",
"children": 
[
    {
        "questionId": 2,
        "parent": 1,
        "description": "Question 2?",
        "children": 
        [
            {
                "questionId": 4,
                "parent": 2,
                "description": "Question 4?",
                "children": []
            }
        ]

    },
    {
        "questionId": 3,
        "parent": 1,
        "description": "Question 3?",
        "children": []
    }
]

Sorry if I'm explaining it poorly or something is missing, I'm not used to post here.

Answer 1

If you just want to iterate through all the question objects, you could try to flatten your data with a recursive function like this,

const flattenQs = (qData) => {
  const flattenedQs = []
  flattenedQs.push({questionId: qData.questionId, parent: qData.parent, description: qData.description})
  for (let i = 0; i < qData.children.length; i++) {
    const qChild = qData.children[i];
    flattenedQs.push(...flattenQs(qChild))
  }
  return flattenedQs
}

Which would give something like this,

[
  {
    questionId:1,
    parent:null,
    description:"Question 1?"
  },
  {
    questionId:2,
    parent:1,
    description:"Question 2?"
  },
  {
    questionId:4,
    parent:2,
    description:"Question 4?"
  },
  {
    questionId:3,
    parent:1,
    description:"Question 3?"
  }
]