Trying to understand Recursion Function

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

So if I look at a bit of javascript like above,
it may run like this:

Function countup(2) called with parameter value 2.
This call creates an object in memory called countUp.
In memory, the object has in it a memory block array named countArray, and a variable block allotted named n where n = 2.
The memory blocks were created by const countArray = countup(n - 1) when n = 2.
if(2 < 1) evaluates false n = 2 & countArray undefined memory block 0.
if(1 < 1) evaluates false n = 1 & countArray undefined memory block 1.
if(0 < 1) evaluates true n = 0 & countArray = , empty array created. The empty array is assigned and filled from stack, first with undefined memory block 1 filled next with value n = 1 replacing undefined memory block 1 then with undefined memory block 0 where n = 2 or countArray [1,2]. Is this what’s happening that output is 1,2?

2

Your explanation goes a bit wonky here.

That line contains a function call. The function call resolves to a return value.

3

Thanks for the clarification. So if I’m understanding, functions are not objects with methods and are stored in memory by value or something like that.

4

A function call and a function definition are different things.

A function call resolves to the return value. The function definition describes how that return value will be reached.

A function doesn’t have methods, no. Objects have methods. A method is a function associated with an object.

A function isn’t ‘stored in memory by value’. A function is a process that takes in values and passes out a return value.

5

Thanks for the help. Based on what you’ve explained, this is now how I understand this recursive function:

A function call, countup(2) is made to the function countup() The function call is processed by the function for the purpose of resolving to a return value. The function’s definition/code describes how a return value can be reached. This process occurs
within a global frame named countup.
Process Steps:
if(2 < 1) evaluates false n=2
countArray evaluates undefined
if(1 < 1) evaluates false n=1
countArray evaluates undefined
if(0 < 1) evaluates true n=0
return (empty array)
countArray.push(1) n=1
return countArray 1
countArray.push(2) n=2
return countArray 1,2

6

I don’t know what you mean by this

No. countArray receives the return value of the recursive call to countup.

7

If at that point, countArray receives the return value, it seems to me the output will be 2,1 not 1,2. By global frame, ‘countup’ as a named block of code.

8

Why would it be that?

What is a ‘global frame’? ‘countup’ is a function.

9

I’ve used this tool to step through this code to try and understand what’s happening. I got the term ‘global frame’ from here.
https://pythontutor.com/render.html#mode=display

Then from Mozilla, I read this , ‘In JavaScript, functions are first-class objects , because they can have properties and methods just like any other object. What distinguishes them from other objects is that functions can be called. In brief, they are Function objects. For more examples and explanations, see the JavaScript guide about functions.’

10

That tool is talking about the call stack. In that, countup refers to a function call, not the ‘block of code’ that is the function definition.

The function call takes inputs and generates corresponding outputs.

Countup is recursive, so there are multiple calls with different inputs to the same function.

11

JeremyLT, I really appreciate you taking your time to help me understand this better.

1 Like
12

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.