Javascript中的通用树实现

时间:2012-08-20 11:39:13

标签: javascript tree

是否有人知道JavaScript的通用树(节点可能有多个子节点)实现?

应该能够做到至少这些事情,

  1. 获取父节点。
  2. 获取子节点。
  3. 得到所有的后代。
  4. 删除所有后代。
  5. 删除子节点。
  6. 一些类似于邻接列表模型的实现。

    背景:我需要基于JavaScript的分层数据存储我的网页我找不到一个很好的通用树的JavaScript实现所以我做的是我使用ajax使用Adjacency List将分层数据存储到数据库中模型和PHP。当用户在同一个浏览器的两个选项卡中打开同一页面或在两个不同的浏览器中打开页面时,问题就出现了,因为两个实例都在写同一个表从同一个表读取,这导致我出现问题。回答我的问题。

    编辑: 效果在任何时候都不是我的约束,我的参赛作品不会超过50个。

2 个答案:

答案 0 :(得分:2)

您可以尝试:https://github.com/afiore/arboreal

或者这个:https://github.com/mauriciosantos/buckets/(只有二元搜索树,但也有其他数据结构)

如果你需要更复杂的东西,你需要编写自己的库(或至少一个对象,你所描述的所有方法)。

编辑:

这是我实现树功能的简单代码。删除所有后代并删除所有子项实际上是相同的......所以:

function Node(value) {

    this.value = value;
    this.children = [];
    this.parent = null;

    this.setParentNode = function(node) {
        this.parent = node;
    }

    this.getParentNode = function() {
        return this.parent;
    }

    this.addChild = function(node) {
        node.setParentNode(this);
        this.children[this.children.length] = node;
    }

    this.getChildren = function() {
        return this.children;
    }

    this.removeChildren = function() {
        this.children = [];
    }
}

var root = new Node('root');
root.addChild(new Node('child 0'));
root.addChild(new Node('child 1'));
var children = root.getChildren();
for(var i = 0; i < children.length; i++) {
    for(var j = 0; j < 5; j++) {
        children[i].addChild(new Node('second level child ' + j));
    }
}
console.log(root);
children[0].removeChildren();
console.log(root);
console.log(root.getParentNode());
console.log(children[1].getParentNode());

在Chrome(或其他支持控制台的浏览器)中运行它。

答案 1 :(得分:1)

虽然您确实说过&#34;通用树&#34;,但对于已经内置的DOMParser,您的特定要求听起来很简单。

我尊重其他程序员&#39;意见,但我认为你可以试试DOM,看看它是否适合你。

以下是有关其工作原理的简单说明:

var tXML="<root><fruit><name>apple</name><color>red</color></fruit><fruit><name>pear</name><color>yellow</color></fruit></root>";
var tree=(new DOMParser).parseFromString(tXML,"text/xml");
//get descendants
var childs=tree.documentElement.childNodes;
for(var i=0;i<childs.length;i++)
{
 if(childs[i].nodeName=="fruit")
 {
  document.write(childs[i].getElementsByTagName("name")[0].textContent);
  document.write(": ");
  document.write(childs[i].getElementsByTagName("color")[0].textContent);
  document.write("<br />");
 }
}
//get child node
var appl=tree.documentElement.getElementsByTagName("fruit")[0];
document.write(appl.getElementsByTagName("name")[0].textContent+"<br />");
//get parent node
document.write(appl.parentNode.nodeName);
document.write("<br />");
//remove child node
if(tree.documentElement.getElementsByTagName("color").length>1)
{
 var clr=tree.documentElement.getElementsByTagName("color")[1];
 clr.parentNode.removeChild(clr);
}
document.write("<textarea>"+(new XMLSerializer).serializeToString(tree)+"</textarea><br />");
//remove descendants
while(tree.documentElement.childNodes.length>0)
{
 tree.documentElement.removeChild(tree.documentElement.childNodes[0]);
}
document.write("<textarea>"+(new XMLSerializer).serializeToString(tree)+"</textarea>");

我没有&#34;简化&#34;那些长函数名称,所以你可能会有更好的想法。