簡體   English   中英

Javascript:搜索分層樹

[英]Javascript : Search hierarchical tree

我必須從 JavaScript 中的分層樹中按名稱獲取孩子 object

我的示例數據如下

{
 id: 2, 
 name: "Alphabet",
 parent: null,
 path: "Alphabet", 
 children: [ 
             { id: 3,
               name: "unit3",
               parent: 2,
               path: "Alphabet/unit3",
               children:[ 
                         { id: 5,
                           name: "unit15",
                           parent: 3,
                           path: "Alphabet/unit3/unit15",
                           children:[]
                         }
                       ] 
            },
            {  id: 4,
               name: "unit6",
               parent: 2,
               path: "Alphabet/unit6",
               children: []
            }
          ]
}

我試過如下:

getChildFromTree(treeObj,name) : any {

    if(treeObj.name == name) {
      return treeObj;
    }    
    var child;
    for(var i=0;i<treeObj.children.length;i++) {
      if(treeObj.children[i].name == name) {
        child =  treeObj.children[i];                   
        break;
      } else {
        child = this.getChildFromTree(treeObj.children[i],name);
      }
    }
    if(child) {
      return child;
    }   
  }

當我搜索“unit15”時我變得不確定請告訴我,我在這里做錯了什么

您正在使用for(var i = 0迭代treeObj.children ,但是即使您在使用遞歸函數this.getChildFromTree時找到一個孩子,它也不會返回,因為for(var i = 0沒有停止(沒有中斷也沒有在 for 循環內的 else 分支中返回)。

您可以簡單地添加一個if (child) return child; 循環內。

不太喜歡重新發明輪子,我建議您使用圖書館。 我們使用對象掃描來處理數據。 一旦您全神貫注,它就會非常強大。 以下是您可以如何回答您的問題:

 // const objectScan = require('object-scan'); const find = (haystack, name) => objectScan(['**.name'], { rtn: 'parent', abort: true, filterFn: ({ value }) => value === name })(haystack); const data = { id: 2, name: 'Alphabet', parent: null, path: 'Alphabet', children: [{ id: 3, name: 'unit3', parent: 2, path: 'Alphabet/unit3', children: [{ id: 5, name: 'unit15', parent: 3, path: 'Alphabet/unit3/unit15', children: [] }] }, { id: 4, name: 'unit6', parent: 2, path: 'Alphabet/unit6', children: [] }] }; console.log(find(data, 'unit15')); /* => { id: 5, name: 'unit15', parent: 3, path: 'Alphabet/unit3/unit15', children: [] } */
 .as-console-wrapper {max-height: 100%;important: top: 0}
 <script src="https://bundle.run/object-scan@13.7.1"></script>

免責聲明:我是對象掃描的作者

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM