CODEWITHSUNDEEP
javascriptfunctionreturn-value
SolSphere
SolSphere

Reputation: 13

Unexpected results from a function

I have the following two blocks of code that I am trying to debug.

function getSectionId(target){
  let element = target;
  if(element.hasAttribute('id')){
    console.log(element.id); 
    return element.id;
  } 
  else {
    getSectionId(element.parentElement);
  }
};

function coverageLimitHandler(event) {
  const target = event.target;
  if (target.getAttribute('data-status') !== 'set') {
    let itemBlock = addLineItem();
    let sectionId = getSectionId(target);
    let attribute = '';
    console.log(sectionId);
  }
}

The event fires and the functions run, but the above gives the unexpected following results

//first-coverage-section (this one is expected.) //undefined (this is expected to be the same, but is not.)

And I cannot for the life of me figure out why this is happening.

Upvotes: 1

Views: 63

Answers (3)

Prince Hernandez
Prince Hernandez

Reputation: 3721

the problem is that your recursive call is not returning anything. when you do:

getSectionId(element.parentElement);

it will call the function and maybe some day, the if above 

if(element.hasAttribute('id')){
    console.log(element.id); 
    return element.id;
  }

will return something, but that won't be returned to the previous calls therefore your main call wont have anything to return, so to solve this you need to do this:

function getSectionId(target){
  let element = target;
  if(element.hasAttribute('id')){
    console.log(element.id); 
    return element.id;
  } 
  else {
    // add this return and your function will work correctly.
    return getSectionId(element.parentElement);
  }
};

basically you have something like this:

function recursiveNotWorking(n) {
  if (n === 5) {
    return "something"
  } else {
    // you dont return anything, then something never bubbles up
    recursiveNotWorking(n + 1);
  }
}

function recursiveWorking(n) {
  if (n === 5) {
    return "something"
  } else {
    // we return something
    return recursiveWorking(n + 1);
  }
}

console.log("NW: ", recursiveNotWorking(1));
console.log("Working: ", recursiveWorking(1));

Upvotes: 1

TigerTV.ru
TigerTV.ru

Reputation: 1086

You don't have return in the first function and you don't check on undefined. Also you don't need to use the element variable. It's useless. Maybe this will work:

function getSectionId(target){
  if (typeof target === 'undefined') return null;
  if(target.hasAttribute('id')){
    console.log(target.id); 
    return target.id;
  } 
  return getSectionId(target.parentElement);
}

Upvotes: 0

Kousha
Kousha

Reputation: 36209

You need to return the result of the recursive call:

const getSectionId = target => {
  if (target.hasAttribute('id') {
    return target.id;
  }

  // You should also check that parentElement exist
  // Otherwise you might reach the root node and then parentElement could become null

  return getSectionId(target.parentElement);
};

Alos, this can be re-written as well as one liner:

const getSectionId = t => t.id || getSectionId(t.parentElement)

Upvotes: 0

Related Questions