动态JavaScript树结构

Question

我想动态地建立层次结构，每个节点创建为层次结构中的一个层/层次，并具有自己的节点数组。这应该形成一个树结构。应该有一个根节点和一个未定义数量的节点和级别来组成层级大小。除了根节点之外，什么都不应该被修复。我不需要阅读或搜索层次结构，我需要构建它。 该数组应该从{“name”：“A”，“children”：[]}开始，并且每个新节点都将创建级别{“name”：“A”，“children”：[HERE - {“name” ：“A”，“children”：[]}]}。在儿童阵列中，越来越深入。基本上，数组在调用之前应该没有值，除了根节点。在函数调用之后，数组应该包含一个数字所需的节点，这个数字可能随着每次调用而变化，这取决于数据库查询的结果。每个子数组将包含一个或多个节点值。应该有至少2个节点级别，包括根。 它最初应该是一个空白画布，即没有预定义的数组值。

Answer 1

function Tree(name,child){ 
     this.name = name; 
     this.children = child || []; 
     this.addNode = function (parent){ 
      this.children = parent; 
     } 
     this.addChild = function (parentName){ 
      this.children.push(new Tree(parentName)); 
     } 
    } 

    var tree = new Tree("A"); // create a tree (or a portion of a tree) with root "A" and empty children 
    tree.addChild("B1"); // A -> B1 
    tree.addChild("B2"); // A -> B2 
    var subTree1 = new Tree("C1"); // create a sub tree 
    subTree1.addChild("D1"); // C1 -> D1 
    subTree1.addChild("D2"); // C1 -> D2 
    tree.children[0].addNode(subTree1); // add this sub tree under A->B1 
    // Tree now is: A--> B1 
    //      C1 
    //      D1 
    //      D2 
    //     B2 
    tree.children[1].addChild("C2"); 
    // Tree now is: A--> B1 
    //      C1 
    //      D1 
    //      D2 
    //     B2 
    //      C2 
    //tree.children[0].addChild("C4"); 
    // Tree now is: A--> B1 
    //      C1 
    //      D1 
    //      D2 
    //      C4 
    //     B2 
    //      C2  
    console.log(JSON.stringify(tree)); 

{ “名称”： “A”， “孩子”：[{ “名称”： “B1”， “孩子”：{ “名称”： “C1”， “儿“：[{ ”名称“： ”D1“， ”孩子“：[] }，{ ”名称“： ”D2“， ”孩子“：[] }] } }，{ “name”：“B2”， “children”：[{“”name“：” C2" ， “孩子”：[] }]} ] }

Answer 2

所以你的节点有一个name:属性和一个children:数组属性。

数据库通常在表存储树木

node-id, parent-id, value1, ..., valueN 

（你可以得到一定的优势，如果你存储深度优先访问顺序和深度优先退货订单;问意见，如果你需要的细节）。

如果你做一个查询并得到这个数据到JSON，你将有类似的信息（您说明），

[{id: "0", parent: "-1", name: "A2"}, {id: "1", parent: "0", name: "A3"}, 
{id: "2", parent: "1", name: "A31"}, {id: "3", parent: "2", name: "A311"}, 
{id: "4", parent: "2", name: "A312"}] 

可以将此转化为{name: children:}格式与下面的代码：

// data is an array in the above format 
function toTree(data) { 
    var childrenById = {}; // of the form id: [child-ids] 
    var nodes = {};  // of the form id: {name: children: } 
    var i, row; 
    // first pass: build child arrays and initial node array 
    for (i=0; i<data.length; i++) { 
     row = data[i]; 
     nodes[row.id] = {name: row.name, children: []}; 
     if (row.parent == -1) { // assume -1 is used to mark the root's "parent" 
      root = row.id; 
     } else if (childrenById[row.parent] === undefined) { 
      childrenById[row.parent] = [row.id]; 
     } else { 
      childrenById[row.parent].push(row.id); 
     } 
    } 
    // second pass: build tree, using the awesome power of recursion! 
    function expand(id) { 
     if (childrenById[id] !== undefined) { 
      for (var i=0; i < childrenById[id].length; i ++) { 
       var childId = childrenById[id][i]; 
       nodes[id].children.push(expand(childId)); 
      } 
     } 
     return nodes[id]; 
    } 
    return expand(root); 
} 

查看http://jsfiddle.net/z6GPB/的工作示例。