复杂树结构，快速获得节点

最新推荐文章于 2024-03-06 00:15:00 发布

bubucuo

最新推荐文章于 2024-03-06 00:15:00 发布

阅读量920

点赞数

分类专栏：前端日记

本文链接：https://blog.youkuaiyun.com/fangfanggaogao/article/details/98449734

版权

前端日记专栏收录该内容

27 篇文章

订阅专栏

这篇博客探讨了在处理复杂树结构时如何快速获取指定ID的节点问题。传统遍历方法在面对大量层级时效率低下。文章提出了两种解决方案：1) 通过字符查找定位节点，然后转换回对象；2) 使用正则匹配技术提取目标节点。这两种方法旨在减少时间消耗，提高查找效率。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

先来看一个项目中常见的结构：

const tree = {
    id: 0,
    children: [
      {
        id: 1, children: [], title: '1'
      }, {
        id: 2, children: [], title: '2'
      }, {
        id: 3, children: [
          {
            haObj: {o1: 1},
            arr: [1, 2, 3],
            haha: "test", 
            id: 4, children: [], title: '4'
          }
        ], title: '3'
      }, 
    ]
  }

我们经常需要做这样一个操作，根据查找tree里的某个节点，比如说找到id为4的节点，并返回当前节点，最普通的办法就是遍历：


  function fun0(tarId, node) {
    for(let item of node) {
      if(item.id==tarId) {
        return item
      } else if(item.children.length) {
        return fun0(tarId, item.children)
      }
    }
  }
  console.log(fun0(4, [tree]))

但是如果结构再复杂些，或者层级非常多的话，就会很消耗时间。如果层级能变成1的话，会省去很多时间。

以下是两种解决办法，转为字符串，根据字符匹配找到当前节点，再用字符串截取出当前节点之后，再转为对象return。

1）用字符查找的办法

  function fun1(tarId, tree) {
    let str = JSON.stringify(tree)
    let part = '"id":' + tarId
    let index = str.indexOf(part)
    let left = str.slice(0, index), right = str.slice(index, str.length)

    let start = -1, soilder = 0
    let leftLen = left.length
    for(let i=leftLen-1; i>=0; i--) {
      let item = left[i]
      if(item==="}") {
        soilder++
      } else if(item==="{") {
        if(soilder===0) {
          start = i
          break
        } else {
          soilder--
        }
      }
    }
    let end = -1
    soilder = 0
    for(let i=0; i<right.length; i++) {
      let item = right[i]
      if(item==="{") {
        soilder++
      } else if(item==="}") {
        if(soilder===0) {
          end = i
          break
        } else {
          soilder--
        }
      }
    }
    end += leftLen + 1
    let res = str.slice(start, end)
    res = JSON.parse(res)
    return res
  }
  console.log(fun1(4, tree))

2）正则匹配