How can I return the searched value inside a loop in a recursive function?

Question

Given the following array of objects acting as a tree of nodes

const tree = [
  {
    label: "Gilfoyle",
    data: 160,
    children: [],
  },
  {
    label: "Nami",
    data: 171,
    children: [],
  },
  {
    label: "Root",
    data: 172,
    expanded: true,
    children: [
      {
        label: "Root child 1",
        data: 174,
        expanded: true,
        children: [
          {
            label: "Root child 2",
            data: 175,
            expanded: true,
            children: [
              {
                label: "Root child 3",
                data: 176,
                expanded: false,
                children: [{}],
              },
            ],
          },
        ],
      },
    ],
  },
  {
    label: "sk3wl 0f r00t",
    data: 159,
    children: [],
  },
  {
    label: "Collection",
    data: 166,
    children: [],
  },
  {
    label: "Compass",
    data: 165,
    children: [],
  },
  {
    label: "Sample",
    data: 17,
    children: [],
  },
  {
    label: "School of root",
    data: 18,
    children: [],
  },
];

I need to get one of these objects by its id

To this end, the following function loops through each node and compares the value of the data property with the id of the searched node.

function getNode(tree, id) {
  if (tree && Array.isArray(tree) && tree.length > 0) {
    for (const node of tree) {
      if (node.data === id) {
        console.dir(node, { depth: null });
        return node;
        break;
      }

      getNode(node.children, id);
    }
  }
}

The node is found as can be seen in the following snippet. But I require the function to return the node.

const tree = [
  {
    label: "Gilfoyle",
    data: 160,
    children: [],
  },
  {
    label: "Nami",
    data: 171,
    children: [],
  },
  {
    label: "Root",
    data: 172,
    expanded: true,
    children: [
      {
        label: "Root child 1",
        data: 174,
        expanded: true,
        children: [
          {
            label: "Root child 2",
            data: 175,
            expanded: true,
            children: [
              {
                label: "Root child 3",
                data: 176,
                expanded: false,
                children: [{}],
              },
            ],
          },
        ],
      },
    ],
  },
  {
    label: "sk3wl 0f r00t",
    data: 159,
    children: [],
  },
  {
    label: "Collection",
    data: 166,
    children: [],
  },
  {
    label: "Compass",
    data: 165,
    children: [],
  },
  {
    label: "Sample",
    data: 17,
    children: [],
  },
  {
    label: "School of root",
    data: 18,
    children: [],
  },
];

function getNode(tree, id) {
  if (tree && Array.isArray(tree) && tree.length > 0) {
    for (const node of tree) {
      if (node.data === id) {
        console.dir(node, { depth: null });
        return node;
        break;
      }

      getNode(node.children, id);
    }
  }
}

const output = getNode(tree, 176);

console.dir(output, { depth: null });

I have confirmed that it only returns the node if the search id is the last element of the list. In the other cases, as in the example, the snippet returns undefined

How can I return the searched value inside a loop in a recursive function?

Does this answer your question? Why doesn't this recursive javascript function return the correct value — user16540390
– user16540390, Commented May 18, 2022 at 16:15

k.tten · Accepted Answer · 2022-05-18 16:17:10Z

1

A quick (and admittedly a little dirty) way is to just check if a value was found by getNode:

const tree = [
  {
    label: "Gilfoyle",
    data: 160,
    children: [],
  },
  {
    label: "Nami",
    data: 171,
    children: [],
  },
  {
    label: "Root",
    data: 172,
    expanded: true,
    children: [
      {
        label: "Root child 1",
        data: 174,
        expanded: true,
        children: [
          {
            label: "Root child 2",
            data: 175,
            expanded: true,
            children: [
              {
                label: "Root child 3",
                data: 176,
                expanded: false,
                children: [{}],
              },
            ],
          },
        ],
      },
    ],
  },
  {
    label: "sk3wl 0f r00t",
    data: 159,
    children: [],
  },
  {
    label: "Collection",
    data: 166,
    children: [],
  },
  {
    label: "Compass",
    data: 165,
    children: [],
  },
  {
    label: "Sample",
    data: 17,
    children: [],
  },
  {
    label: "School of root",
    data: 18,
    children: [],
  },
];

function getNode(tree, id) {
  if (tree && Array.isArray(tree) && tree.length > 0) {
    for (const node of tree) {
      if (node.data === id) {
        console.dir(node, { depth: null });
        return node;
        break;
      }

      const found = getNode(node.children, id);

      if (found) return found;
    }
  }
}

const output = getNode(tree, 176);

console.dir(output, { depth: null });

answered May 18, 2022 at 16:17

k.tten

26.8k4 gold badges34 silver badges63 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Mario Over a year ago

Works. Out of curiosity. Why do you think it's a little dirty solution?

k.tten Over a year ago

It's not the cleanest. You should try to go for either a return statement at the end of the recursive function, or make the return statement the only statement in the body for the "cleanest" (but not always the best).

Mario Over a year ago

Makes sense. Thanks for the reply. Recursion is usually a mess for me. I appreciate the assistance

Collectives™ on Stack Overflow

How can I return the searched value inside a loop in a recursive function?

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related