Javascript 以层次/树格式打印JSON对象

对象：

[
   {
      "Item":{
         "Name":"User 4"
      },
      "Children":[
         
      ]
   },
   {
      "Item":{
         "Name":"User 1"
      },
      "Children":[
         {
            "Item":{
               "Name":"User 6"
            }
         },
         {
            "Item":{
               "Name":"User 2"
            }
         }
      ]
   }
]

我使用以下代码遍历此对象：

(function Traverse(o) {
    for (var i in o) {
        console.log('Value: ' + o[i].Item.Name);

        if (o[i].Children !== null && o[i].Children !== [] && typeof(o[i].Children) == "object") {
            Traverse(o[i].Children);
        }
    }
  })
(data);

输出：

value: User 4
value: User 1
value: User 6
value: User 2
undefined

我希望输出采用层次/树格式。我发现了几个库，但我不想要一个适当的图形表示，只是简单地使用文本来表示层次结构

大概是这样的：

---

另外，我不是javascript程序员。

编辑：我发现在代码段中执行代码时，格式有点不正确。如果将代码粘贴到devtools并运行它，则格式正确

我找到了一个npm包来做这个。以下是您的需求示例：

/**
*可以可视化的节点树。
*/
Ascitrie类{
/**
*创建一个节点。
*@param text节点的文本内容
*@param此节点的子节点（也可以通过“添加”添加）
*/
构造函数（文本，…子项）{
this.text=文本；
这是。_children=new Array（）；
for（const child of children）{
本.加上（儿童）；
}
}
/**
*将树打印到输出流。
*/
打印树（输出=进程.stdout）{
让ancestorsPrefix=''；
for（此.祖先的常量父对象）{
//-1表示“隐藏”根，因此它是子级
//将全部显示为根（级别0）。
如果（父级0）{
如果（这个最后一个）{
如果（！this.empty）{
myPrefix+='└─┬ ';
MultilePrefix+='└─┬ ';
}
否则{
myPrefix+='└── ';
MultilePrefix=''；
}
}
否则{
如果（！this.empty）{
myPrefix+='├─┬ ';
MultilePrefix+='│ │ ';
}
否则{
myPrefix+='├── ';
MultilePrefix+='│   ';
}
}
}
如果（此.text）{
输出.写入（ancestorsPrefix）；
output.write（myPrefix）；
常量行=this.text.split（'\n'）；
output.write（第[0]行）；
output.write（'\n'）；
用于（常数线.拼接（1））{
输出.写入（ancestorsPrefix）；
输出.写入（MultilePrefix）；
输出。写入（行）；
output.write（'\n'）；
}
}
对于（此的const child.\u children）{
printree（输出）；
}
}
/**
*返回树的字符串表示形式。
*/
toString（）{
放出=''；
这是打印树({
写入：（数据）=>（输出+=数据），
});
返回；
}
/**
*将子节点添加到节点。
*/
添加（…子项）{
for（const child of children）{
child.parent=这个；
这个。_children.push（child）；
}
}
/**
*返回子数组的副本。
*/
得到孩子{
返回此.u children.map（（x）=>x）；
}
/**
*@如果这是根节点，则返回true
*/
获取根（）{
return！this.parent；
}
/**
*@如果这是最后一个子项，则返回true
*/
最后一个{
如果（！this.parent）{
返回true；
}
return（this.parent.children.indexOf（this）==this.parent.children.length-1）；
}
/**
*@返回节点级别（0为根节点）
*/
获取级别（）{
如果（！this.parent）{
//如果根节点没有文本，则将其视为级别-1
//这样所有的孩子都会成为根。
返回此文本。文本？0:-1；
}
返回此.parent.level+1；
}
/**
*@如果此节点没有任何子节点，则返回true
*/
变空{
返回this.children.length==0；
}
/**
*@返回父节点数组（从根节点到此节点，独占）
*/
获取祖先（）{
如果（！this.parent）{
返回[]；
}
return[…this.parent.祖先，this.parent]；
}
}
康斯塔雷格=[
{
“项目”：{
“名称”：“用户4”
},
“儿童”：[
]
},
{
“项目”：{
“名称”：“用户1”
},
“儿童”：[
{
“项目”：{
“名称”：“用户6”
}
},
{
“项目”：{
“名称”：“用户2”
}
}
]
}
];
函数obj2tree（obj，tree）{
const subTree=new ascitree（`${obj.Item.Name}`）；
if（对象为自有财产（“子女”））{
obj.Children.forEach（o=>{
obj2树（o，子树）；
});
}
添加（子树）；
}
const treeStr=（objarr=>{
const tree=new ascitree（'root'）；
objarr.forEach（obj=>{
obj2tree（obj，tree）；
});
return tree.toString（）；
})（g）；
console.log（treeStr）；

编辑：我发现在代码段中执行代码时，格式有点不正确。如果将代码粘贴到devtools并运行它，则格式是正确的

我找到了一个npm包来实现这一点。以下是您的需求示例：

/**
*可以可视化的节点树。
*/
Ascitrie类{
/**
*创建一个节点。
*@param text节点的文本内容
*@param此节点的子节点（也可以通过“添加”添加）
*/
构造函数（文本，…子项）{
this.text=文本；
这是。_children=new Array（）；
for（const child of children）{
本.加上（儿童）；
}
}
/**
*将树打印到输出流。
*/
打印树（输出=进程.stdout）{
让ancestorsPrefix=''；
for（此.祖先的常量父对象）{
//-1表示“隐藏”根，因此