1.单目标遍历
已知数据结构如下:
let treeData =[
{
label: "二年级",
children: [
{
label: '一班',
children: [
{
label: '小丽'
}
]
},
]
},
{
label: "三年级",
children: [
{
label: "一班",
children: [
{
label: "小东",
},
{
label: "小红",
},
],
},
{
label: "二班",
children: [
{
label: "小明",
},
],
},
],
},
]
实现目标,找出小东所在年级班级(假设没有同名情况,只存在唯一)
三年级一班小东
for递归实现
function findParentsLabel(targetName, list, parentNames = '') {
for (let item of list) {
if (item.label == targetName) {
return parentNames + targetName
} else if (item.children && Array.isArray(item.children) && item.children.length) {
let names = findParentsLabel(targetName, item.children, parentNames + item.label)
if (names) return names
}
}
return ''
}
调用
console.log(findParentsLabel(‘小东’,treeData))
打印结果:
2.多目标遍历
需求进阶改进,假设小东不止存在一个班级也不限存在某一层
已知数据结构如下:
let treeData = [
{
label: "二年级",
children:[
{
label:'小东'
},
{
label:'二班'
}
]
},
{
label: "三年级",
children: [
{
label: "一班",
children: [
{
label: "小东",
},
{
label: "小红",
},
],
},
{
label: "二班",
children: [
{
label: "小明",
},
],
},
],
}
];
实现目标:找出包含“小东“的所有父级组合名称(例如:三年级一班小东),从数据可以看出包含“小东”就2条数据分别是“三年级一班小东”,“二年级小东”,所以我们目标是找到二维数组
['三年级一班小东','"二年级小东']
reduce递归实现:
function findParentsLabelArr(targetName,list,parentNames=''){
return list.reduce((prev, cur) => {
if (cur.label == targetName) {
prev.push(parentNames+targetName)
} else if (cur.children && Array.isArray(cur.children) && cur.children.length) {
prev = [...prev, ...findParentsLabelArr(targetName, cur.children, parentNames + cur.label)]
}
return prev
}, [])
}
调用
console.log(findParentsLabel(‘小东’,treeData))
打印结果: