如何停止此递归函数

How to stop this recursive function?

本文关键字:递归函数 何停止      更新时间:2023-09-26

我有一个javascript数组,其中每个项都有对父项的引用,它们可以循环(循环引用)。示例:

[
        {"id": 1, "firstName": "Macko","parentId": 12},
        {"id": 2, "firstName": "Jess","parentId": 1},
        {"id": 3, "firstName": "Peter","parentId": 1},
        {"id": 4, "firstName": "Lisa", "parentId": 1},
        {"id": 5, "firstName": "Megan","parentId": 1},
        {"id": 6, "firstName": "John", "parentId": 4},
        {"id": 7, "firstName": "Joe", "parentId": 4},
        {"id": 8, "firstName": "Matthew","parentId": 2},
        {"id": 9, "firstName": "Peter","parentId": 2},
        {"id": 10, "firstName": "Dio","parentId": 5},
        {"id": 11, "firstName": "Hello","parentId": 5},
        {"id": 12, "firstName": "Ana", "parentId": 4}
]

我需要根据所选记录创建嵌套的数据结构,以将其显示在DOM中,这是我通过如下递归函数实现的(这里的源代码)

function getNestedChildren(arr, parent) {
  var out = []
  for(var i in arr) {
    if(arr[i].parent == parent) {
        var children = getNestedChildren(arr, arr[i].id)
        if(children.length) {
            arr[i].children = children
        }
        out.push(arr[i])
    }
  }
  return out
}

它工作得非常好,但不适用于循环数据结构。问题是,我需要在函数到达它启动的元素之前停止函数执行。

我怎样才能做到这一点?

checked数组保留已调用getNestedChildren的所有对象(父对象)的ids。

如果当前子级的id在该数组中,请不要将其作为子级包含。

var arr = [
  {"id": 1, "firstName": "Macko","parentId": 12},
  {"id": 2, "firstName": "Jess","parentId": 1},
  {"id": 3, "firstName": "Peter","parentId": 1},
  {"id": 4, "firstName": "Lisa", "parentId": 1},
  {"id": 5, "firstName": "Megan","parentId": 1},
  {"id": 6, "firstName": "John", "parentId": 4},
  {"id": 7, "firstName": "Joe", "parentId": 4},
  {"id": 8, "firstName": "Matthew","parentId": 2},
  {"id": 9, "firstName": "Peter","parentId": 2},
  {"id": 10, "firstName": "Dio","parentId": 5},
  {"id": 11, "firstName": "Hello","parentId": 5},
  {"id": 12, "firstName": "Ana", "parentId": 4}
];
var getNestedChildren = function(arr, id, checked) {
  var out = [];
  for (var i = 0; i < arr.length; i++) {
    if (arr[i].parentId === id && checked.indexOf(arr[i].id) === -1) {
      checked.push(id);
      var children = getNestedChildren(arr, arr[i].id, checked);
      if (children.length) {
        arr[i].children = children;
      }
      out.push(arr[i]);
    }
  }
  return out;
};
console.log(getNestedChildren(arr, 12, []));

也许这样的东西应该对你有用:

function getNestedChildren(arr, parent, visited_list) {
  var out = []
  for(var i in arr) {
    if(!(arr[i].id in visited_list) && (arr[i].parentId == parent)) {
        visited_list[arr[i].id] = true;
        var children = getNestedChildren(arr, arr[i].id, visited_list)
        if(children.length) {
            arr[i].children = children
        }
        out.push(arr[i])
    }
  }
  return out
}
nestedList = getNestedChildren(arr, 1, [])

您可以标记已经访问过的条目。基于此,您可以跳过对同一元素的处理两次。

在将children属性添加到元素时,可以将其用于此标记目的,前提是在元素没有子元素时也创建此属性。

以下是工作代码:

function getNestedChildren(arr, parent) {
  var out = [];
  for(var i in arr) {
    if(arr[i].parentId == parent) {
        if (arr[i].children === undefined) {
            arr[i].children = []
            var children = getNestedChildren(arr, arr[i].id)
            arr[i].children = children
        }
        out.push(arr[i])
    }
  }
  return out
}
var arr = [
    {"id": 1, "firstName": "Macko","parentId": 12},
    {"id": 2, "firstName": "Jess","parentId": 1},
    {"id": 3, "firstName": "Peter","parentId": 1},
    {"id": 4, "firstName": "Lisa", "parentId": 1},
    {"id": 5, "firstName": "Megan","parentId": 1},
    {"id": 6, "firstName": "John", "parentId": 4},
    {"id": 7, "firstName": "Joe", "parentId": 4},
    {"id": 8, "firstName": "Matthew","parentId": 2},
    {"id": 9, "firstName": "Peter","parentId": 2},
    {"id": 10, "firstName": "Dio","parentId": 5},
    {"id": 11, "firstName": "Hello","parentId": 5},
    {"id": 12, "firstName": "Ana", "parentId": 4}
]
getNestedChildren(arr, 1)
// Output the lengths of the children's arrays
document.body.innerHTML = arr.map(function (item) {
    return 'Item ' + item.id + ' has ' + item.children.length + ' children.'
}).join('<br>')