# Recursion Countdown Stack diagram or Tree Diagram

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

Can anyone help me with the tree diagram or stack diagram of function call countup(5)
so that i can understand better how it is actually working behind scene.

Thanks

Your code has been blurred out to avoid spoiling a full working solution for other campers who may not yet want to see a complete solution. In the future, if you post a full passing solution to a challenge and have questions about it, please surround it with `[spoiler]` and `[/spoiler]` tags on the line above and below your solution code.

Thank you.

try looking at your code with this

http://www.pythontutor.com/javascript.html

Itâ€™s the question. Itâ€™s not my solution so you can remove the blur thanks

itâ€™s the solution to the challenge. The blur is to avoid accidentally spoiling it to people that are maybe searching for hints

you can post a full working solution if you have question about it if you use the spoiler tags so that people need to manually unhide it.

I will not remove the blur, and also please avoid doing it yourself

I copied question in IDE itâ€™s a question feel free to check

ok, it is not a solution

please next time include where you did find the algorithm

1 Like

Please can you explain following questions

1. How variable `const countArray` is keeping reference of function `countup(n - 1)`?. Since it being called n-1 times, what is actually happening behind scene.

2. is Global Frame = Execution Stack ? in JavaScript ES5 ?

1. What does n(block 1)| undefined mean in the above pic?.
2. How can we make a tree-like structure like below diagram and how should we traverse it to get the output?

this is a little bug with variables declared with let or const, it is the `countArray` variable - it is undefined until the function returns a value

maybe this works better:
http://latentflip.com/loupe/

frame reference the scope of the variables, global, or to which function or block it refers (like `countup` is the name of the local frame(s))

I think you get a tree like structure for fibonacci because of the definition
for just counting up it seems pretty linearâ€¦

``````countup(5) == [...countup(4), 5] == [...countup(3), 4, 5] // etc
``````

for a fibonacci sequence, the n-th number is equal to the (n-1)-th plus the (n-2)-th number , so you get a tree like structure

countup(5) == [â€¦countup(4), 5] == [â€¦countup(3), 4, 5] // etc

Can you explain how u got 5 ? should it be â€¦countup[4],countup[5] ? How did u resolve the value. ?

`countup(5)` should give `[1,2,3,4,5]`
`countup(4)` should give `[1,2,3,4]`
so `countup(5)` is also equal to `countup(4).concat(5)`

the 5 is the difference between the two calls output

On the top of stack countup(0) will be there and it will return [];.Countup(0) will be popped. Then on top of stack countup(1) will be there tell me how 1 is pushed in empty array [] ?

after `countup(0)` returns `[]` (so that is the value assigned to `countArray`), `n` (which has value of `1` in this case) is pushed to `countArray`, so now `countArray` is `[1]`

Hey thanks Magical Girl. I also found how to make a tree and travel in top-down-left right order and it gives correct explanation too.