为什么在 javascript 的 for-in 循环内执行 return 语句后的代码？

Question

my variable look like this

var widgets2 = [{
    id: "1",
    title: 'title',
    children: [],
  },
  {
    id: "2",
    title: 'title2',
    children: []
  },
  {
    id: "3",
    title: 'title3',
    children: [{
      id: "4",
      title: 'title4',
      children: [],
    }, {
      id: "5",
      title: 'title5',
      children: [],
      children: [{
          id: "6",
          title: 'title6',
          children: [],
        },
        {
          id: "7",
          title: 'title7',
          children: [],
        }
      ]
    }],
  },
  {
    id: "9",
    title: 'title9',
    children: [],
  }
]

The function code look like this

function findTheKey(id,widget){
 let newObj=[...widget];
    for(var key in newObj){
        if(newObj[key]['id']==id){
        console.log(newObj[key])
        return newObj[key];
        }
        console.log("came here")
        if(newObj[key].hasOwnProperty("children")){
         findTheKey(id,newObj[key].children);
        }
    }
}

When the called the function using following code

var result=findTheKey(4,widgets2);
console.log(result) 

The result look like this

{id: "4", title: "title4", children: Array(0)}
 came here

That means even after executing return statement, console.log getting executed, any help will be highly appreciated. Thankyou

Answer 1

Since this is a recursive function, the return does not have the effect you expect, you need a variable outside the recursive function to keep the current state of what you want to find.

See the snippet below for example:

 var widgets2 = [ { id: "1", title: "title", children: [], }, { id: "2", title: "title2", children: [], }, { id: "3", title: "title3", children: [ { id: "4", title: "title4", children: [], }, { id: "5", title: "title5", children: [], children: [ { id: "6", title: "title6", children: [], }, { id: "7", title: "title7", children: [], }, ], }, ], }, { id: "9", title: "title9", children: [], }, ]; let found; function findTheKey(id, widget) { let newObj = [...widget]; for (var key in newObj) { if (newObj[key]["id"] == id) { found = newObj[key]; break; } if (newObj[key].hasOwnProperty("children")) { findTheKey(id, newObj[key].children); } } return found; } var result = findTheKey(4, widgets2); console.log(result);

Answer 2

You should update your question for this, but since you asked for it in the comments, here is what I propose.

function findTheKey(id, widget) {
  const newObj = [...widget];
  for (const key in newObj) {
    if (newObj[key]["id"] === `${id}`) {
        return newObj[key];
    }
    if (newObj[key].hasOwnProperty('children')) {
        /* Use the result of the recursive function */
        const foundObject = findTheKey(id, newObj[key].children);
        if(foundObject) return foundObject;
    }
  }
  return false;
}