Home > Software design >  Return matching nodes in a nested tree: Javascript
Return matching nodes in a nested tree: Javascript

Time:10-10

I have an array of objects that is implemented as a tree with the follwing structure. I am trying to implement a search functionality that basically searches the key inside these objects and return them by maintaining the relationship.

const arr = [
  {
    name: "internalcorp.com",
    config: {
      val1: false,
      val2: false
    },
    children: [
      {
        name: "internalcorp.com.child1",
        config: {
          val1: true,
          val2: true
        },
        children: [
          {
            name: "internalcorp.com.grandchild1",
            config: {
              val1: true,
              val2: true
            },
            children: []
          },
          {
            name: "internalcorp.com.grandchild2",
            config: {
              val1: false,
              val2: true
            },
            children: []
          }
        ]
      },
      {
        name: "internalcorp.com.child2",
        config: {
          val1: true,
          val2: false
        },
        children: []
      }
    ]
  },
  {
    name: "internalcorpwebsite.com",
    children: [
      {
        name: "internalcorpwebsite.com.child1",
        className: "level-1 leaf",
        children: [],
        val1: false,
        val2: false
      }
    ],
    config: {
      val1: false,
      val2: false
    }
  }
];

Here I need to search the array based on key "name" recursively , and return that object maintaining the parent-child relationship. THe search should be a contains search

Code that I tried:

function result(input) {
  let res = arr.map((item) => {
    if (item.name === input) return item;
  });
  return res;
}
console.log(result("website"));

CodePudding user response:

Something like this, you can play with it here: Codepen Playground I've made the search to case insensitive and you can also search for multiple words, it should give you full tree and maintain parent-child relationship, try it out

const arr = [
  {
    name: "internalcorp.com",
    config: { val1: false, val2: false },
    children: [
      {
        name: "internalcorp.com.child1",
        config: { val1: true, val2: true },
        children: [
          {
            name: "internalcorp.com.grandchild1",
            config: { val1: true, val2: true },
            children: []
          },
          {
            name: "internalcorp.com.grandchild2",
            config: { val1: false, val2: true },
            children: []
          }
        ]
      },
      {
        name: "internalcorp.com.child2",
        config: { val1: true, val2: false },
        children: []
      }
    ]
  },
  {
    name: "internalcorpwebsite.com",
    children: [
      {
        name: "internalcorpwebsite.com.child1",
        className: "level-1 leaf",
        children: [],
        val1: false,
        val2: false
      }
    ],
    config: {
      val1: false,
      val2: false
    }
  }
];
function result(input) {
  const v = input.replace(/[.* ?^${}()|[\]\\]/g, "\\$&");
  const regex = new RegExp(v.trim().replace(" ", "|"), "i");
  return arr.filter(function f(o) {
    let found = false;
    if (regex.test(o.name)) found = true;
    if (o.children) {
      const x = o.children.filter(f);
      if (x.length) {
        o.children = x;
        return true;
      }
      return found;
    }
  });
}
console.log(result("website.com"));

  • Related