如何递归地找到特定的对象形式树

Question

我想从下面的树中找到基于ID的单个json objec。 示例 - getObjeById(4)，

它应该从树下面返回obj。需要帮助。

data={
  "mytree": {
    "id": "dectree",
    "dt": {
      "choice": {
        "id": 0,
        "title": "Which color",
        "description": "Choose color ?",
        "choice": [
          {
            "id": 1,
            "title": "Yellow",
            "description": "Yellow ? ",

            "choice": [
              {
                "id": 5,
                "title": "Dark Yellow",
                "description": "Dark Yellow ,
                "choice": [
                  {
                    "id": 6,
                    "title": "id 6 yello",
                    "description": "<span> last leaf for yello </span>"
                  }]
              },
              {
                "id": 4,
                "title": "Light Yellow",
                "description": "Light Yellow 
              }
            ]
          },
          {
            "id": 2,
            "title": "Red",
            "description": "Red ?"
          },
          {
            "id": 3,
            "title": "Green",
            "description": "Green 
          },
          {
            "id": 7,
            "title": "white",
            "description": "white color",
             "choice": [
                  {
                    "id": 8,
                    "title": "id 8 white",
                    "description": "<span> last leaf for white </span>"
                  }]
          }
        ]
      }
    }
  }
}

Answer 1

下面是一个展示递归搜索功能的片段。

警告说，此功能大约需要6毫秒才能搜索到这棵树，大约是标准60 fps帧的三分之一。

＆＃13;

＆＃13;

var data = {
  "mytree": {
    "id": "dectree",
    "dt": {
      "choice": {
        "id": 0,
        "title": "Which color",
        "description": "Choose color ?",
        "choice": [{
          "id": 1,
          "title": "Yellow",
          "description": "Yellow ? ",
          "choice": [{
            "id": 5,
            "title": "Dark Yellow",
            "description": "Dark Yellow",
            "choice": [{
              "id": 6,
              "title": "id 6 yello",
              "description": "<span> last leaf for yello </span>"
            }]
          }, {
            "id": 4,
            "title": "Light Yellow",
            "description": "Light Yellow"
          }]
        }, {
          "id": 2,
          "title": "Red",
          "description": "Red ?"
        }, {
          "id": 3,
          "title": "Green",
          "description": "Green"
        }, {
          "id": 7,
          "title": "white",
          "description": "white color",
          "choice": [{
            "id": 8,
            "title": "id 8 white",
            "description": "<span> last leaf for white </span>"
          }]
        }]
      }
    }
  }
};
//Here comes the recursive function
function searchTree(data, idLabel, idValue, results) {
  if (idLabel === void 0) {
    idLabel = "id";
  }
  if (idValue === void 0) {
    idValue = "0";
  }
  if (results === void 0) {
    results = [];
  }
  var keys = Object.keys(data);
  keys.forEach(function search(key) {
    if (typeof data[key] == "object") {
      results = searchTree(data[key], idLabel, idValue, results);
    } else {
      if (data[key] == idValue && key == idLabel) {
        results.push(data);
      }
    }
  });
  return results;
}
console.log("Looking for 4:", searchTree(data, "id", "4"));
console.log("Looking for 6:", searchTree(data, "id", "6"));

＆＃13;

＆＃13;

＆＃13;

编辑 - 扁平结构

理想的结构看起来更像是这样：

＆＃13;

＆＃13;

var data = [{
  id: 1,
  title: "Yellow",
  description: "Yellow ? ",
  choices: [4, 5]
}, {
  id: 2,
  title: "Red",
  description: "Red ?",
  choices: []
}, {
  id: 3,
  title: "Green",
  description: "Green",
  choices: []
}, {
  id: 4,
  title: "Light Yellow",
  description: "Light Yellow",
  choices: []
}, {
  id: 5,
  title: "Dark Yellow",
  description: "Dark Yellow",
  choices: [6]
}, {
  id: 6,
  title: "id 6 yello",
  description: "<span> last leaf for yello </span>",
  choices: []
}, {
  id: 7,
  title: "white",
  description: "white color",
  choices: [8]
}, {
  id: 8,
  title: "id 8 white",
  description: "<span> last leaf for white </span>",
  choices: []
}];

console.log("Get elements with id == 7", data.filter(function(i) {
  return i.id === 7
})[0]);
console.log("Get elements with id == 2", data.filter(function(i) {
  return i.id === 1
})[0]);
console.log("Get elements with id == 3 or id == 4", data.filter(function(i) {
  return i.id === 3 || i.id === 4
}));

＆＃13;

＆＃13;

＆＃13;

使用上述结构，使用filter遍历树变得微不足道。在这个结构上大约2毫秒的计算时间，它应该更好地扩展。

从这里开始，我们也可以轻松地sort我们的列表或使用优化的本机功能以多种方式操作它。

Answer 2

有没有办法找到immeida父窗体节点？我现在特定的geeting例子id：5，它可能是一个父母的一部分whcih是id：3。