首页 > 解决方案 > 如何编码'DOM方法的ID以在递归中使用'?

问题描述

我在“getObjectById 在递归中使用”中遇到问题。执行功能getObject(data, '11')---> undefined。我不知道为什么会这样:undefined

在功能getObject(data, '1'~'9') --->我得到了解决。但是'11' ,'12', '13', '14'--->undefined

为了解决这个问题,我必须使用forEach, Array.prototype.apply,但我无法解决它。

使用filter--->TypeError: Cannot read property 'filter' of undefined

使用length--->TypeError: Cannot read property 'length' of undefined

在第一行中,我有问题要解决。在第二行中,我编写了代码来解决这个问题。因为我认为我解释了解决问题的逻辑。但是,在测试用例中,它失败了。

这个问题的解决方法是:

let output = getObjectById(TREE_DATA.items, '1'))

console.log(output) --> { "id": "1", "name": "johnny" }
    --in first under line, 
    let TREE_DATA = {
      items: [
        {
          id: "1",
          name: "johnny"
        },
        {
          id: "2",
          name: "ingi",
          children: [
            {
              id: "3",
              name: "johnson"
            },
            {
              id: "4",
              name: "katy"
            },
            {
              id: "5",
              name: "steve",
              children: [
                {
                  id: "6",
                  name: "lisa"
                },
                {
                  id: "7",
                  name: "penny",
                  children: [
                    {
                      id: "8",
                      name: "john"
                    },
                    {
                      id: "9",
                      name: "hoyong"
                    }
                  ]
                },
                {
                  id: "10"
                }
              ]
            },
            {
              id: "11"
            },
            {
              id: "12"
            }
          ]
        },
        {
          id: "13"
        },
        {
          id: "14"
        }
      ]
    };

    --in second under line,

    function getObject(json, id) {
      let test = json.items;
      let newA = [];

      function getA(a, id) {
        a.filter(function(e) {
          console.log("this is : ", e);
          if (e.id && e.id === id) {
            return newA.push(e);

          } else if (e.id !== id && e.children) {
            return getA(e.children, id);
          }
        });
      }

      getA(test, id);
      return newA[0];
    }

标签: javascriptrecursion

解决方案


因为您的输入数据是递归结构,所以具有递归结构的程序将是最佳匹配。在这种情况下,您有 -

  • 节点列表( ) _ _TREE_DATA.items
  • 其中每个节点对象)可能包含一个children 属性,它也是一个节点列表

这种递归关系为我们提供了一个独特的机会来了解特殊类型的递归,其中一个函数A调用函数B,该函数又调用函数A,该函数调用B,依此类推……这称为相互递归

我们从一个只接受一个输入节点的函数开始,恰当地命名为find1. 它接受单个节点,解构为childrenand o,以及要搜索的 id,id-

const find1 = ({ children = [], ...o }, id = 0) =>
  o.id == id                 // if the object's id matches the input id,
    ? o                      // match found! return the object
    : findAll(children, id)  // otherwise findAll of the children with the id

接下来很明显我们需要实现findAll. 它接受一个节点列表,解构为firstand more,以及一个要搜索的 id,id-

const findAll = ([ first, ...more ], id = 0) =>
  first === undefined        // if the list is empty,
    ? undefined              // there's nothing to search! return no match
    : find1(first, id)       // find1 the first item in the list using the id
      || findAll(more, id)   // OR findAll on more using the same id

就是这样!这些函数几乎可以自行编写,不需要额外的变量或步骤。它的行为与我们预期的完全一样——

console.log(findAll(TREE_DATA.items, 1))
// { id: "1", name: "johnny" }

console.log(findAll(TREE_DATA.items, 11))
// { id: "11" }

console.log(findAll(TREE_DATA.items, 99))
// undefined (no match found)

通过运行以下代码段在您自己的浏览器中验证结果 -

const find1 = ({ children = [], ...o }, id = 0) =>
  o.id == id
    ? o
    : findAll(children, id)

const findAll = ([ first, ...more ], id = 0) =>
  first === undefined
    ? undefined
    : find1(first, id) || findAll(more, id)

const TREE_DATA =
    {items:[{id:"1",name:"johnny"},{id:"2",name:"ingi",children:[{id:"3",name:"johnson"},{id:"4",name:"katy"},{id:"5",name:"steve",children:[{id:"6",name:"lisa"},{id:"7",name:"penny",children:[{id:"8",name:"john"},{id:"9",name:"hoyong"}]},{id:"10"}]},{id:"11"},{id:"12"}]},{id:"13"},{id:"14"}]}

console.log(findAll(TREE_DATA.items, 1))
// { id: "1", name: "johnny" }

console.log(findAll(TREE_DATA.items, 11))
// { id: "11" }

console.log(findAll(TREE_DATA.items, 99))
// undefined (no match found)


推荐阅读