Javascript 创建一个表，显示JSON对象的对象层次结构

我的目标如下：

let数据={
A:{
B1：{
C1:{
D1:“富”
},
C2:{
D2:“酒吧”，
D3：“baz”
}
},
B2:{
C3：{
D4:“qux”
},
C4：{
D5：“quux”
}
}
}
};

我想创建一个函数，创建一个表，在类似“Sankey图”的视图中显示嵌套结构：

---

我将我的解决方案分解为一些伪代码：

get_表（数据）：
#使用“tr”元素映射结果行
返回recurse_dataset.map（行=>“行”）
#返回行列表（仅“td”元素）
递归_数据集（数据）：
如果数据是根：
返回数据
其他：
#获取所有子行并添加到结果
结果=[]
对于键，数据中的值：
根数=根数（值）
#进一步递归到对象中以获取根行
对于索引，递归_数据集中的行（值）：
#如果我们是第一个结果，我们有孩子，
#添加带有重叠的关键单元格
如果索引=0且根>0：
row=“key”+行
结果+=行
返回结果
根数（数据）：
如果数据是根：
返回1
其他：
计数=0
对于数据中的值：
计数+=根数（值）
返回计数

或者，在片段中：

const getTable=函数（数据）{
返回getRows（data）.map（row=>`${row}`）。join（“”）；
};
const getRows=函数（数据）{
if（数据类型！=“对象”）{
返回[
`${data}`
];
}
否则{
让结果=[]；
for（让对象的[key，value]项（数据））{
让子对象=getChildrenCount（值）；
让rows=getRows（值）；
rows.forEach（（行，索引）=>{
if（索引==0&&children）{
行=`${key}
${row}`；
}
结果：推动（世界其他地区）；
});
};
返回结果；
}
};
const getChildrenCount=函数（数据）{
if（数据类型！=“对象”）{
返回1；
}
否则{
让计数=0；
for（让对象的[key，value]项（数据））{
计数+=getChildrenCount（值）；
};
返回计数；
}
};
让数据={
A:{
B1：{
C1:{
D1:“富”
},
C2:{
D2:“酒吧”，
D3：“baz”
}
},
B2:{
C3：{
D4:“qux”
},
C4：{
D5：“quux”
}
}
}
};
$（“tbody”）.append（getTable（data））
表td，
表th{
最小宽度：2米；
最小高度：2米；
边框：1px实心#000；
}