javascript - 动态 Javascript 树结构

标签 javascript loops dynamic-data javascript-objects tree-structure

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

最佳答案

    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));

输出

{
  "name": "A",
  "children": [
    {
      "name": "B1",
      "children": {
        "name": "C1",
        "children": [
          {
            "name": "D1",
            "children": []
          },
          {
            "name": "D2",
            "children": []
          }
        ]
      }
    },
    {
      "name": "B2",
      "children": [
        {
          "name": "C2",
          "children": []
        }
      ]
    }
  ]
}

关于javascript - 动态 Javascript 树结构,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12522022/

相关文章:

javascript - 除了第一次,jQuery 对象永远不会改变

javascript - 应用不返回返回值

php - 根据另一个下拉列表填充下拉列表的最佳和最简单方法是什么

java - 条形图中的动态数据无法正常工作javaFX

java - 我可以在Java中更改循环内的变量名称吗

javascript - 在 niceScroll Js 中禁用垂直滚动

javascript - $.getJSON() + $.each() 导致某些对象的键名称未定义

PHP - 在循环的帮助下从表单插入mysql数据库,可能吗?

python - 提高 Python 嵌套 for 循环的性能

arrays - 批量循环菜单(多选)