javascript recursion return wrong value

Question

There is a piece of recursive function that I was working on and it seems to be returning the wrong value than what is expected. I was able to replicate it and simplify the function into:

function foo(i, target){    
    if(i < target){
        i++;
        foo(i, target);
    }

    return i;   
}
console.log(foo(0,5));

Basically, given the function above, I expect the return value to be 5. However, it seems to return 1. When I did some tracing, I notice that "return i" is being called several times and each time it gets decremented with 1? What's the reason for this behaviour and what can I do to fix it?

Suren Srapyan · Accepted Answer · 2017-12-01 09:52:31Z

5

You need also to return form the if part in your code.

function foo(i, target){    
    if(i < target){
        i++;
        return foo(i, target);
    }
   
    console.log(i);
    return i;   
}

console.log(foo(0,5));

Why your code returns 1?

Because it only calls the foo every time while i < target and after it you get all values returned from the nested calls in order 5, 4, 3, 2, 1 and the last one is returned from the first function call is printed. You can check this by putting simple console.log before the return i and compare to the above result.

function foo(i, target){    
    if(i < target){
        i++;
        foo(i, target);
    }
   
    console.log(i);
    return i;   
}

console.log(foo(0,5));

To visualize the returned values you can see

 console.log()                               console.log()
 |   Call with 1                             -- return Call with 1
 |   |   Call with 2                            -- return Call with 2
 |   |   |   Call with 3                           -- return Call with 3
 |   |   |   |   Call with 4                          -- return Call with 4
 |   |   |   |   |   Call with 5        VS               -- return Call with 5  
 |   |   |   |   |   return 5
 |   |   |   |   return 4
 |   |   |   return 3
 |   |   return 2
 |-- return 1

edited Dec 1, 2017 at 9:52

answered Dec 1, 2017 at 9:36

Suren Srapyan

68.9k14 gold badges128 silver badges119 bronze badges

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

5 Comments

rafael nextor Over a year ago

Thanks you for you explanation on why it returned 1. It gave me an idea and ran the trace again. There I noticed the call stack with several foo calls and as I step over "return i" , each call gets popped.

Suren Srapyan Over a year ago

See also the visualization I made, it can help you

Soolie Over a year ago

How do you do the trace with Google Dev Tools?

moon Over a year ago

@Soolie Press F12 and go to Sources tab

rafael nextor Over a year ago

yup, there is a "Call Stack" section

marvel308 · Accepted Answer · 2017-12-01 09:37:42Z

2

You are not returning the value of the recursive call

function foo(i, target){    
    if(i < target){
        i++;
        return foo(i, target);
    }

    return i;   
}
console.log(foo(0,5));

answered Dec 1, 2017 at 9:37

marvel308

10.5k3 gold badges24 silver badges32 bronze badges

Comments

Soolie · Accepted Answer · 2017-12-01 09:37:49Z

2

You have to give return to the recursive function call as well:

return foo(i, target);

function foo(i, target) {
  if (i < target) {
    i++;
    // Change here...
    return foo(i, target);
  }
  return i;
}
console.log(foo(0, 5));

answered Dec 1, 2017 at 9:37

Soolie

1,77211 silver badges21 bronze badges

1 Comment

rafael nextor Over a year ago

apologies @Soolie but I have to give it to Suren Srapyan for helping me understand why it was returning 1. cheers!

Collectives™ on Stack Overflow

javascript recursion return wrong value

3 Answers 3

5 Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related