Recursion challenge in curriculum

Today i saw this code on a challenge:

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

Now it’s well explained what is going to happen as the result will be an array of values of n pushed each time the n is decremented and passed in an inner call.
My question is when n become less that 1 the resulted value is then recursion stops, where does this resulted empty brackets go? Is it added to the resulted array countArray? What do we do with it?
Thank you.

countArray is always an array. That’s the entire reason that the recursion works.

1 Like

Somebody told me on this forum before that recursive function returns an array, otherwise why do we push a value to countArray?

So where that empty brackets returned by the n<1 condition goes ?do you know?

The empty array is still an array.

I am on my phone, so it is hard to type a full explanation. I would Google or search the forum for ‘recursion call stack’. There are some really great videos out there on the topic.

1 Like

The empty array is the array that all the elements are finally pushed into. It may be easier to understand if you draw it out on a piece of paper with only a couple of element (2 or 3 for n). The stack counts from n towards 0. Once 0 is reached the empty array is returned and as you go back up the stack each element is pushed onto the end of the array.

2 Likes

I would try to be more clear this time. Here, if you look closely the last function call will be countup(0) and that returns an empty array. The next recursion will take this empty array and push the current number which is 1 into that array and returns [1] to the next which will then push 2 to into the array and return [1,2] to the next push. This way eventually we go all the way back up until we reach our original function call which is countup(5).

1 Like

freeCodecamp released a really good video on recursion you should check out.

5 Likes

It is like;
countup(5); → {"Stack 0 ": n < 1 == false → else → countup(4); →
{“Stack 1”: n < 1 == false → else → countup(3); →
{“Stack 2”: n < 1 == false → else → countup(2); →
{“Stack 3”: n < 1 == false → else → countup(1): →
{“Stack 4”: n < 1 == false → else → countup(0); →
{“Stack 5”: n < 1 == true → return (countArray=) back up to “Stack 4”} →
“Stack 4”: (continue in else) → countArray.push(1) → return [1] to “Stack 3”} →
“Stack 3”: → countArray.push(2) → return [1, 2] to “Stack 2”} →
“Stack 2”: → countArray.push(3) → return [1, 2, 3] to "Stack 1} →
“Stack 1”: → countArray.push(4) → return [1, 2, 3, 4] to "Stack 0} →
“Stack 0”: → countArray.push(5) → return [1, 2, 3, 4, 5] to function call} →

console.log(countup(5)); // [1, 2, 3, 4, 5] is returned from “Stack 0”

Hopefully this makes sense and helps your understanding without confusing you any further.

2 Likes

Thank you all guys i got it.

2 Likes
understand = false

while (!!understand) {
    If (you understand how call-stack works in JavaScript) {
        use the site below to have a firm grasp of how this code is executed
        https://pythontutor.com/javascript.html#mode=edit
        understand = true;
    } else {
        check this video: 
        https://www.youtube.com/watch?v=8aGhZQkoFbQ
    }
}