JavaScript递归函数无限循环，没有得到正确的答案

Question

我正在编写一个递归函数，以找出与传递给函数的id相同的项。

正如您所看到的，每个对象项都有一个id属性，该项也有一个包含一些其他对象或空数组的sub_categories属性。

const arr = [
{
"id": 1013,
"code": "CAT1",
"name": {
"en": "TOP 1",
"fr": "TOP 1"
},
"_name": "TOP 1",
"level": 1,
"sub_categories": [
{
"id": 1016,
"code": "SUB1",
"name": {
"en": "Child 1",
"fr": "Child 1"
},
"_name": "Child 1",
"level": 2,
"sub_categories": [
{
"id": 1017,
"code": "SUB11",
"name": {
"en": "Child 2",
"fr": "Child 2"
},
"_name": "Child 2",
"level": 3,
"sub_categories": [
{
"id": 1018,
"code": "SUB111",
"name": {
"en": "Child 3",
"fr": "Child 3"
},
"_name": "Child 3",
"level": 4,
"sub_categories": [
{
"id": 1019,
"code": "SUB21",
"name": {
"en": "Child 4",
"fr": "Child 4"
},
"_name": "Child 4",
"level": 5,
"sub_categories": []
}
]
}
]
}
]
}
]
},
{
"id": 1014,
"code": "CAT2",
"name": {
"en": "TOP 2",
"fr": "TOP 2"
},
"_name": "TOP 2",
"level": 1,
"sub_categories": [
{
"id": 1020,
"code": "SUB22",
"name": {
"en": "Child 1",
"fr": "Child 1"
},
"_name": "Child 1",
"level": 2,
"sub_categories": []
}
]
},
{
"id": 1015,
"code": "CAT3",
"name": {
"en": "TOP 3",
"fr": "TOP 3"
},
"_name": "TOP 3",
"level": 1,
"sub_categories": []
}
]

const arrFilter = (targetId) => {
let res = null;
for(let y = 0; y < arr.length; y++) {
if (arr[y].id === targetId) {
res = arr[y];
} else if(arr[y].sub_categories.length) {
res = arrFilter(arr[y].sub_categories, targetId)
}

if(res !== null) return res;
}
}
console.log(arrFilter(1017))

当我传递id1017时，它抛出一个错误，称为Maximum call stack size exceeded，它似乎无限循环。有人知道为什么我的代码会无限循环吗？

Answer 1

您在函数中使用arr来搜索项，但是，如果您第二次调用该函数，则仍然使用arr。

您需要将数组本身传递给函数，以便第二次(递归(只搜索该部分：

const arr = [{"id": 1013, "code": "CAT1", "name": {"en": "TOP 1", "fr": "TOP 1"}, "_name": "TOP 1", "level": 1, "sub_categories": [{"id": 1016, "code": "SUB1", "name": {"en": "Child 1", "fr": "Child 1"}, "_name": "Child 1", "level": 2, "sub_categories": [{"id": 1017, "code": "SUB11", "name": {"en": "Child 2", "fr": "Child 2"}, "_name": "Child 2", "level": 3, "sub_categories": [{"id": 1018, "code": "SUB111", "name": {"en": "Child 3", "fr": "Child 3"}, "_name": "Child 3", "level": 4, "sub_categories": [{"id": 1019, "code": "SUB21", "name": {"en": "Child 4", "fr": "Child 4"}, "_name": "Child 4", "level": 5, "sub_categories": [] } ] } ] } ] } ] }, {"id": 1014, "code": "CAT2", "name": {"en": "TOP 2", "fr": "TOP 2"}, "_name": "TOP 2", "level": 1, "sub_categories": [{"id": 1020, "code": "SUB22", "name": {"en": "Child 1", "fr": "Child 1"}, "_name": "Child 1", "level": 2, "sub_categories": [] } ] }, {"id": 1015, "code": "CAT3", "name": {"en": "TOP 3", "fr": "TOP 3"}, "_name": "TOP 3", "level": 1, "sub_categories": [] } ];
const arrFilter = (search, targetId) => {
let res = null;
for (let y = 0; y < search.length; y++) {
if (search[y].id === targetId) {
res = search[y];
} else if(search[y].sub_categories.length) {
res = arrFilter(search[y].sub_categories, targetId)
}

if(res !== null) return res;
}
}
console.log(arrFilter(arr, 1017))

---

稍有改进的版本可能看起来像：

const arr = [{"id": 1013, "code": "CAT1", "name": {"en": "TOP 1", "fr": "TOP 1"}, "_name": "TOP 1", "level": 1, "sub_categories": [{"id": 1016, "code": "SUB1", "name": {"en": "Child 1", "fr": "Child 1"}, "_name": "Child 1", "level": 2, "sub_categories": [{"id": 1017, "code": "SUB11", "name": {"en": "Child 2", "fr": "Child 2"}, "_name": "Child 2", "level": 3, "sub_categories": [{"id": 1018, "code": "SUB111", "name": {"en": "Child 3", "fr": "Child 3"}, "_name": "Child 3", "level": 4, "sub_categories": [{"id": 1019, "code": "SUB21", "name": {"en": "Child 4", "fr": "Child 4"}, "_name": "Child 4", "level": 5, "sub_categories": [] } ] } ] } ] } ] }, {"id": 1014, "code": "CAT2", "name": {"en": "TOP 2", "fr": "TOP 2"}, "_name": "TOP 2", "level": 1, "sub_categories": [{"id": 1020, "code": "SUB22", "name": {"en": "Child 1", "fr": "Child 1"}, "_name": "Child 1", "level": 2, "sub_categories": [] } ] }, {"id": 1015, "code": "CAT3", "name": {"en": "TOP 3", "fr": "TOP 3"}, "_name": "TOP 3", "level": 1, "sub_categories": [] } ];
const arrFilter = (search, targetId) => {
for (const obj of search) {
if (obj.id === targetId) {
return obj;
}
if (obj.sub_categories.length > 0) {
const tmp = arrFilter(obj.sub_categories, targetId);
if (tmp) {
return tmp;
}
}
}
return false;
}
console.log(arrFilter(arr, 1014))