Javascript

Question

我继承了一些 JavaScript 代码。它根据 json 数据绘制层次树（使用 D3 版本 3 库）。该代码有效。我需要做一个小的修改，但是如何修改是个问题。我有一个名为 treeData 的 object。 treeData 是树中节点的分层列表。每个节点都有属性，例如 name、id、depth、x、y 和 children。 Children是一个数组，指向当前节点的child个节点。所以 children 可以有 children，可以有 children，等等。如果我查看 treeData object，我会看到 'root' 节点，并且我看到它有 10 children.

children数组在结构上与parent相同...这显示扩展了第一个child，我看到它有3个child仁。我的数据通常有 3-4 层深。

我的挑战是我需要运行一个针对树中所有节点的函数。我确信有一种优雅的方法可以做到这一点，但我不知道它会是什么……我需要类似的东西……

var myNode;
for (var zz = 0; zz <= treeData.children.length; zz++) {
myNode = treeData.children[zz];
collapseNode(myNode);
}

问题是这只是查看一个级别，而不是遍历层次结构...我如何重写它以访问层次结构中的每个节点？

Answer 1

function traverse(array){
  for(const obj of array){
     //do whatever with obj, than go deeper
     traverse(obj.children);
  }
}

如果你通过递归深入，那就很简单了。

Answer 2

试试这个递归方法

function processNode(node)
{
    collapseNode(myNode); //logic for current node
    (treeData.children || []).forEach( function( chidNode ){
       processNode( chidNode ); //if there are children invoke the same method for each child node
    });
}
processNode( treeData ); //invoke for your treeData

Answer 3

试试这个 -

function traverse(o) {
    for (i in o) {
        // if o is an object, traverse it again
        if (!!o[i] && typeof(o[i])=="object") {
            console.log(i, o[i])
            traverse(o[i]);
        }
    }
}

Javascript - 遍历数组的分层 object

Javascript - Traversing Hiarchial object of Arrays

hierarchy