TS实现递归查找树结构数组

 0 0条评论

树结构数组在开发实践中是很常见的,必须是菜单权限等。

例如以下树结构:

interface ITree {
    ID: number,
    name: string,
    age: number,
    child?: ITree[]
}

const tree: ITree[] = [{
    ID: 1,
    name: '张三',
    age: 18,
    child: [{
        ID: 2,
        name: '李四',
        age: 20
    }, {
        ID: 3,
        name: '王五',
        age: 28
    }],
}, {
    ID: 4,
    name: '赵六',
    age: 88
}
]

想要查找ID为3的数据,那么此时就要使用到递归了,传统的函数find()、map()、filter()都无法直接实现。

这里用到了ts的泛型,这样可以使函数结构更清晰,更通用,话不多,直接上代码。

/**
 * 递归查找符合ID条件的子节点
 * @param list 对象集合
 * @param searchKey 搜索的关键字
 * @param childKey 子节点的关键字
 * @param value 搜索的值
 */
const findName = <T>(list: T[], searchKey: keyof T, childKey: keyof T, value: string | number | boolean) => {
    let result: any
    for (let item of list) {
        if (item[searchKey] === value) {
            result = item
            break
        }
        else if (item[childKey]) {
            let childResult: T = findName<T>(item[childKey] as T[], searchKey, childKey, value)
            if (childResult)
                return childResult
        }
    }
    return result as T
}

这样就能递归查找啦。

const result = findName<ITree>(tree, 'name', 'child', '李四')

最后有一个问题,就是如果存在多个name为李四的数据的话,只会返回第一个,所以大家有更完善的代码,可以交流。

本文作者:双黑

版权声明:本站文章欢迎链接分享,禁止全文转载!

游客