Dynamic Hierarchical Javascript Object Loop

Question

   var treeData = {"name" : "A",  "children" : [
                         {"name" : "B", "children": [
                                 {"name" : "C", "children" :[]}
                          ]}
                   ]};

THE ARRAY BEFORE SHOULD BE EMPTY. THE ARRAY AFTER SHOULD BE POPULATED DEPENDING ON THE NUMBER OF NODES NEEDED THAT WILL BE DEFINED FROM A DYNAMIC VALUE THAT IS PASSED.

I would like to build the hierarchy dynamically with each node created as a layer/level in the hierarchy having its own array of nodes. THIS SHOULD FORM A TREE STRUCTURE. This is hierarchy structure is described in the above code.There should be a root node, and an undefined number of nodes and levels to make up the hierarchy size. Nothing should be fixed besides the root node. I do not need to read or search the hierarchy, I need to construct it. The array should start {"name" : "A", "children" : []} and every new node as levels would be created {"name" : "A", "children" : [HERE-{"name" : "A", "children" : []}]}. In the child array, going deeper and deeper. Basically the array should have no values before the call, except maybe the root node. After the function call, the array should comprise of the required nodes of a number that may vary with every call depending on the results of a database query. Every child array will contain one or more node values. There should be a minimum of 2 node levels, including the root. It should initially be a Blank canvas, that is no predefined array values.

Answer 1

Here is the example of function to create your nodes dynamically:

function createNode(name) {
   return({name: name, children: []});
}

function addChild(node, child) {
    node.children.push(child);
    return node;
}

var treeData = createNode("");
var subChild = createNode("");
addChild(subChild, createNode("A31"));
addChild(treeData, subChild);

But I suggest to use prototypes instead.

To find any node by 'path' with any level:

function findNodeByPath(root, path) {
   var curr; 
   while(root && ((curr = path.splice(0,1)[0]) !== undefined)) {
        if (root.children) root = root.children[curr];
        else root = undefined;
   }
   return root;
}


function findNodeByName(root, namePath, create) {
   var curr; 
   while(root && ((curr = namePath.splice(0,1)[0]) !== undefined)) {
        if (root.children) {
            var found = undefined;
            for (var i = 0; !found && i < root.children.length; i++)
                if (root.children[i].name == curr) found = root.children[i];
            if (create && !found) {
                found = createNode(curr);
                addChild(root, found);
            }
            root = found;
        }
        else root = undefined;
   }
   return root;
}


var A31 = findNodeByPath(treeData, [0, 0]); // Will return the node with name A31
addChild(A31, createNode("A31 child 1"));
addChild(A31, createNode("A31 child 2"));

// second child will be accessible by:
var secondChildOfA31 = findNodeByPath(treeData, [0, 0, 1]);

// also to find node by the name:
var secondChildOfA31 = findNodeByName(treeData, ["", "A31", "A31 child 2"]);

// will create all intermenient nodes with respective names:
var veryDeepChild =  findNodeByName(treeData, ["foo", "bar", "baz", "quux", "moo"], true);

function createOuterNode(name, childNode) {
    return {name: name, children: childNode? [childNode] : []}
}

// Example to create nodes in the question:
var CNode = createOuterNode("C");
var BNode = createOuterNode("B", CNode);
var ANode = createOuterNode("A", BNode);

// Example using LOOP:
var list = ["A", "B", "C"];
var outer = undefined;
for (var i = list.length - 1; i >= 0; i--) outer = createOuterNode(list[i], outer);

// outer will contain A node with child B with child C
console.log(outer);