Question

我有一个简单的函数查看数组中的对象。如果找不到基于属性的匹配项，则会检查它是否有子项，然后检查每个属性是否为属性值。

它似乎通过带有子项的第一个对象按预期工作，但它没有达到第三层。

对象是这样的：

 data = [{
    title: 'Home',
    route: '/reports/home',
  },
  {
   title: 'Layer 2',
   children: [
     { title: 'Title 1', route: '/reports/title1' },
     { title: 'Title 2', route: '/reports/title2' },
   ],
  },
  {
    title: 'Layer 3',
    children: [
      { title: 'Title 3', route: '/reports/title3' },
      { title: 'Title 4', route: '/reports/title4' },
    ],
  }];


lookUpTitle = navGroup => {
  for (let item of navGroup) {
    if (item.route && item.route.toLowerCase() === '/reports/title3') {
      console.log(item.title)
      return item.title;
    } else {
      if (item.children) {
        return this.lookUpTitle(item.children);
      }
    }
  }
};
    
lookUpTitle(data)

我只是调用函数并按上面的方式传入数组。

我可以很好地找到Title 2，但是如果我正在寻找标题3或4，那么该函数将不会迭代到数组中的第三个对象。我错过了什么？

Answer 1

有问题，那是因为<div id="productrow" style="display: none"> <tr> <td class="record"></td> <td></td> </tr> </div>

return

试试这个

         if (item.children) {
            //from here it will come out as its return 
             return this.lookUpTitle(item.children);
          }

Answer 2

发生了什么

要理解循环停止的原因，让我们一步一步地写出正在发生的事情：

item获取第一个对象的值。（Title = Home）。
未达到if条件且item不包含children
item获取第二个对象的值。
未达到if条件，但item包含children
该函数返回函数调用lookUpTitle()的结果，因此循环停止。
返回第1步，但使用第二个对象的子值。

因此，如果对象不符合if条件且包含children，则循环将始终停止。

如何修复

为了解决这个问题，我们必须跟踪递归结果。检查是否通过lookUpTitle()的递归调用找到了结果。如果没有，继续循环，如果找到，你可以退货。此方法假设您只希望找到第一个结果而不是所有现有结果。

lookUpTitle = navGroup => {
  for (let item of navGroup) {
    if (item.route && item.route.toLowerCase() === '/reports/title3') {
      return item.title;
    } else {
      if (item.children) {
        var res = this.lookUpTitle(item.children);
        if(res != undefined)
          return res;
      }
    }
  }
};

Answer 3

如果for循环遍历一个有子节点的项目（如第二个那样），它将始终返回一个值，退出for循环。

对于＆＃34; else＆＃34;你需要检查一下lookUpTitle是否真正找到了所需的标题。如果是，则返回，否则，继续for循环。

对于每个循环在数组完成之前中断

3 个答案: