今天就掰扯掰扯js遍历Tree

2021-07-15 09:42:57 浏览数 (1)

问题描述

遍历tree难点在于怎么找到每一个节点的值,同时判断还有没有更多的节点,也就是说,将所有的节点都找到且拿到节点的值!那么我们的思路就比较明确了,首先我们认为他是没有任何节点了,直接将我们需要的 数据给到一个函数A进行操作,然后操作的时候判断一下是他的childrens是不是存在且同时为我们需要的数组类型,如果是,就调我们之前操作对象的函数A,这样就可以直接将所有的节点都找到!代码实现如下:

代码语言:javascript复制
//声明一个tree的数据
var arrData = [
         {
        id:1,
        name:"tom",
        childrens:[{
            id:1,
            name:"jim"
            },{
            id:2,
            name:"lisi"
            }]
    }, {
        id:2,
        name:"jerry",
        childrens:[{
            id:1,
            name:"karry"
            },{
            id:2,
            name:"wanger",
                childrens:[
                       {
                    id:1,
                    name:"mali"
                     }]
        },{
        id:3,
        name:"wangwu"
        }]
    }
];

//声明一个函数,做的操作是将数组中的每一项作为一个操作对象进行操作,比如你要根据一些特定条件进行筛选数据等,这里我们将里面的所有的name全部列出来!
let tickFilter = (function(){
    let tempArr = new Array()
    let getFilterReault = function(arg){
            tempArr.push(arg.name)
        if(arg.childrens instanceof Array && null != arg.childrens){
            for(let child of arg.childrens){
                getFilterReault(child)
            }
        
    }
    //到这为止,以上的代码其实可以将数组中的对象给拿出来了,但是获取的是子节点中的数据,因为我们没有原数据的入口,作为一个工具我们需要有一个入口,也就是将原数组作为参数传递进去的这么一个入口!
    return {
        filterFunc:function(arr){
            tempArr = new Array()
                for(let item of arr){
                    getFilterReault(item)
                }
            return tempArr
        }
    }
})()

console.log(tickFilter.filterFunc(arrData))
打印结果
总结

其实看完代码你就会发现,这玩意他不难,只是我们很多时候不去理解他而已!

0 人点赞