Looping through nested JSON object like tree object

Question

I have an object,

var cObj = {
  name: 'Object1',
  oNumbers: 3,
  leaf: [
    {
      name: 'Inner Object 1',
      oNumbers: 4,
      leaf: []
    },
    {
      name: 'Inner Object 2',
      oNumbers: 9,
      children: [
        {
          name: 'Inner Object 1 2',
          oNumbers: 2,
          leaf: []
        }
      ]
    }
  ]
}

I wanted to loop through all the nodes and wanted to print eg:

  Object 1
  Number 3
      Inner Object 1
      Number 4

      Inner Object 2
      Number 9

         Inner Object 1 2
         Number 2

I was thinking to loop through using recursive but couldn't achieve. Can someone please guide me through.

Possible duplicate of [Access / process (nested) objects, arrays or JSON](https://stackoverflow.com/q/11922383/218196) — Felix Kling, Sep 17 '17 at 05:12
Possible duplicate of [Access / process (nested) objects, arrays or JSON](https://stackoverflow.com/questions/11922383/access-process-nested-objects-arrays-or-json) — Hassan Imam, Sep 17 '17 at 05:13

score 0 · Answer 1 · answered Sep 17 '17 at 05:11

if the structure is as you say, use this function.

function loop(parent, spaces) {
    var output = "";
    spaces = spaces || 0;
    if (parent.length>0  ) {
        for(var index in parent) {
            output += loop(parent[index], spaces+1);
        }
    } else {

        for(var prop in parent) {
            output +=" ".repeat(spaces) + prop + " : " 
            if (Array.isArray(parent[prop])) {
                output +="\n";            
                output += loop(parent[prop],spaces+1);
            } else {
                output += parent[prop] + "\n";
            }
        }
    }
    return output;
}

console.log(loop(cObj));

score 0 · Answer 2 · answered Sep 17 '17 at 05:30

Yes, you could basically write a recursive function to achieve this. Please check the code snippet below:

var cObj = {
  name: 'Object1',
  oNumbers: 3,
  leaf: [
    {
      name: 'Inner Object 1',
      oNumbers: 4,
      leaf: []
    },
    {
      name: 'Inner Object 2',
      oNumbers: 9,
      children: [
        {
          name: 'Inner Object 1 2',
          oNumbers: 2,
          leaf: []
        }
      ]
    }
  ]
};

function printTree(root, level){
 
 printValue(root.name, level);
 printValue('Number ' + root.oNumbers, level);
  
 var children;
 if(root.leaf == null)
 {
    children = root.children;
 }
 else
 {
    children = root.leaf;
 }
 
 if(children == null || children.length == 0){
  return;
 }

 for(var index = 0; index < children.length; index++){
   printTree(children[index], level + 1);
 }
}

function printValue(value, totalSpaces){
  var spaces = ' ';
  for(var counter = 0; counter < totalSpaces; counter++){
    spaces += '  ';
  }
  
  console.log(spaces + value);
}

printTree(cObj, 0);

printTree(root, level) : Prints the root node and calls the same function recursively for each of its children. level denotes the level of the node, 0 for the topmost/root object. since the object can contain either leaf/children, null checks have been added, feel free to modify based on the data model.
printValue(value, totalSpaces) : Takes care of printing the spaces before displaying the node values (to get the hierarchical display in the example you have posted)

Looping through nested JSON object like tree object

2 Answers2