Can't understand this recursive function

I didn’t understand how this recursive function works, especially when I used the debugger, when it reached the base case so the if statement is correct and it should originally return the empty array and then stop, but suddenly it continued to the else statement even if “if” statement is correct, before reaching the base case n was decreasing and after reaching the base case it started to increase , also many times I thought that the function will stop it continued executing, actually I didn’t who how the code was returning from line 9 to 8 then 8 to 9 until n is in the max and even it was weird how is n increasing without increment statement help please

function countup(n) {
  if (n < 1) {
    return [];
  } else {
    const countArray = countup(n - 1);
    countArray.push(n);
    return countArray;
  }
}
console.log(countup(5));

n doesn’t change within a single countup call.

There’s a function call in which n is 5, and then another where it’s 4, and another where it’s 3, and another where it’s 2, and another where it’s 1, and another where it’s 0.

n is just a different value in each of those contexts.

Good, that’s about decrement
What about increment when arr.push is being executed?

Watch it run here.

The first call pauses at this line because it needs to evaluate countup(4)

const countArray = countup(4);

which pauses here because it needs to evaluate countup(3)

const countArray = countup(3);

which pauses here because it needs to evaluate countup(2)

const countArray = countup(2);

which pauses here because it needs to evaluate countup(1)

const countArray = countup(1);

which pauses here because it needs to evaluate countup(0)

const countArray = countup(0);

which returns [], so now we can go back to the n=1 context and complete its execution

countArray.push(1);

which returns [1], so now we can go back to the n=2 context and complete its execution

countArray.push(2);

which returns [1, 2], so now we can go back to the n=3 context and complete its execution

countArray.push(3);

which returns [1, 2, 3], so now we can go back to the n=4 context and complete its execution

countArray.push(4);

which returns [1, 2, 3, 4], so now we can go back to the n=5 context and complete its execution

countArray.push(5);

which return [1, 2, 3, 4, 5]

2 Likes

You’re great!
Thanks really

I have some questions yet.

1st: Why after returning the function executed countArray.push(n);
doesn’t return stop the function?

2nd: Why after returning countArray the function returned to the previous line? why it didn’t stop as I said in the first question?

@colinthornton

recursion

Each function call is separate. One function call returning doesn’t clobber every single instance of the function on your computer.

it stops the current running instance, that includes return in it. In this case

if (n < 1) {
return
}

It can stop the function, if it isn’t included in any instances insides the function.

function countup(n) {
if(){}
 return
}

const countArray = someFunction(5 - 1);

To put it another way, this line right here says ‘call someFunction, get the result, and then proceed to the next line’.

It doesn’t matter if the function calls itself. Function calls work the same way. They go run the steps of the function logic, get the return value, and come back to the place in the code where the function was called from.