Why does recursion fill an array?

JavaScript
1

I’ve got the solution but I’m having trouble understanding why it’s happening.

When the function (let’s say countdown(2)) below operates, it starts to call itself until it equals 0. It then returns an empty array.
The function will then go back and complete the part of the "else statement that was equal to countdown(2-1) aka countdown(1). It then adds n (1) to the array.

This is where I’m confused. How does it know where to add (.unshift) n to?

Maybe I need to know more about the basics of functions? Can they only return one “thing” at the end, thus making the empty array the only place .unshift to place something?

Your code so far


// Only change code below this line
function countdown(n){
if (n <= 0){
  return [];
} else {
  var arr = countdown(n-1);
  arr.unshift(n);
  return arr;
}
}
// Only change code above this line




**Your browser information:**

User Agent is: <code>Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.125 Safari/537.36</code>.

**Challenge:** Use Recursion to Create a Countdown

**Link to the challenge:**
https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-javascript/use-recursion-to-create-a-countdown
2

Each time the function is called, the function call is its own instance. With recursion, the function is based on previous results from a reduced input. countdown(4) will return [4,3,2,1], so countdown(5) will take that result and unshift to produce [5,4,3,2,1]. countdown(5) doesn’t know about any empty array.

1 Like
3

Thank you for the reply.

Perhaps I’m thinking about this wrong. I’m assuming that the reason that the returned value is inside an array is because when n <= 0, it returns . Then the arr.unshift(n) occurs and places n into that newly formed array.

Is that wrong or the wrong way to think about it?

4

Yeah, the three ‘tricks’ to recursion are

  1. Recursion is based on the results from the same function called with ‘smaller’ inputs

  2. Each function call is independent

  3. Each function call ends with a return

I’m on my phone right now, so I can’t type it out, but I’d try console.loging n at the start of the function and console.loging the value that you return right before the return statement to see what happens.

Also, someone posted a link in a similar topic about this problem. The link is to a website that runs your code step by step and shows how the function calls interact, but I don’t have the link handy.

1 Like
5

That’s a great idea! Thank you! I will add the console.log into the start of the function. That should help me see into what’s happening along the way.

I appreciate the tip. I’ll look to see if I can find that website. I greatly appreciate your help!

1 Like
6

I think I understand now. I’ve put some pseudo code to try to explain it to myself as the function progresses.

console.log(countdown(5))

countdown(5)

countdown(4)

countdown(3)

  countdown(2)

    countdown(1)

      countdown(0)

      return [] (which my code is assigning to var arr ) - this was where I was confused. Then .unshift adds n to the beginning of the array.

    [1]

  [2,1]

[3,2,1]

[4,3,2,1]

[5,4,3,2,1]

7

That looks correct to me!

1 Like
8

Thanks Jeremy! I appreciate your help!

1 Like