目的:从数据中获取符合要求的数据,并中断循环
思路:递归查找
要点:获取指定数据后,中断循环并返回指定数据
// 树形数据
const arr = [{
label: '一级 1',
children: [{
label: '二级 1-1',
children: [{
label: '三级 1-1-1'
}]
}]
}, {
label: '一级 2',
children: [{
label: '二级 2-1',
children: [{
label: '三级 2-1-1'
}]
}, {
label: '二级 2-2',
children: [{
label: '三级 2-2-1'
}]
}]
}, {
label: '一级 3',
children: [{
label: '二级 3-1',
children: [{
label: '三级 3-1-1'
}]
}, {
label: '二级 3-2',
children: [{
label: '三级 3-2-1'
}]
}]
}]
方法一:通过try{ throw err } catch (err) {}
通过在try中运行递归代码,查找到指定的数据后,通过throw 把需要的数据抛出来(throw 表示抛出错误,catch是捕获错误) ,同时会在catch中捕获抛出来的数据,throw可以中断循环。
function dg() {
let newItem
try {
const findName = (item) => {
console.log(item)
if (item.label == '三级 3-1-1') {
throw '999'; //找到节点抛出
}
if (item.children && item.children.length > 0) { //子节点进行递归
for (let i in item.children) {
findName(item.children[i]);
}
}
}
for (let i in arr) { //最外层循环
findName(arr[i]);
}
} catch (name) {
newItem = name; //找到的节点
}
return newItem;
}
console.log(dg())
方法二:
全局定义flag,作用:在递归查到目标数据后,return 时不会继续循环,因为深入递归后会嵌套多级循环,return当前的循环后,会继续执行上一个嵌套循环,所有,需要在找到数据后,将flag设置为false,在层层return后不会执行循环。
全局newItem 用于接收数据
var flag = true
var newItem = null
function dg(arr) {
console.log(arr)
if (flag) {
for (let item of arr) {
if (item.label == '三级 2-1-1-1') {
newItem = '9999'
flag = false
return newItem;
}
if (item.children && item.children.length > 0 && flag) {
dg(item.children);
}
}
}
return newItem;
}
console.log(dg(arr))