Baffled by Replace Loops using Recursion

Tell us what’s happening:

Hello everyone,

I’m seriously struggling to understand this. Well let me rephrase that. I understand that concept of the topic but I find the code confusing. I think what confuses me the most is how the arguments are processed within the function. When you do the sum or product (the example code using multiplication) is each index processed individually? I don’t even know if that makes sense. I tried writing it out on a piece of paper, in a sense like an algebra problem but that didn’t help. Could someone please break this down for me? This is so important for me to grasp! Thank you.

Your code so far


function sum(arr, n) {
 // Only change code below this line
function sum(arr, n) {
   if (n <= 0) {
 
   }
 }
 // Only change code above this line
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:75.0) Gecko/20100101 Firefox/75.0.

Challenge: Replace Loops using Recursion

Link to the challenge:

I find this concept pretty mind-bending to.

If I am not mistaken, yes, and added to the call stack, then processed in reverse.

I once recorded a walkthrough video with the countup example. I made a whole lot of breakpoints in the dev tools and watched the call stack. I think doing this by yourself might help.


This is the video I learnt from.
Remember the concepts he teaches and you can understand most of the recursions.
However the implementation of recursion as a replacement can be daunting and takes time to master.

This is how i like to look at it. Using the example given.

function multiply(arr, n) {
    if (n <= 0) {
      return 1;
    } else {
      return multiply(arr, n - 1) * arr[n - 1];
    }
  }

Just like stated, the recursive function is defined by two cases

  1. Base case (For this particular case is the if statement)
  2. The Recursive case(For this particular case is the else statement)

When you call multiply like

multiply([2,3,4,5,2,3], 3);

, you enter the if statement. Since n > 0, the if statement will evaluate to false. The else will be evaluated. But in the else statement, the function is calling itself. This is what happens in the else clause.

   multiply([2,3,4,5,2,3],  2) *  4;  

Explanation:
At this point n = 3. We are returning multiply(arr, n - 1) * arr[n - 1] which means we call the function itself with the arguments [2,3,4,5,2,3] for arr and 2 for n - 1 and multiply the return value of that call by 4 ( arr[n-1] evaluates to arr[2] giving us the third element of the array [2,3,4,5,2,3] which is 4.

Since the function has called itself, the evaluation of the first return statement is paused. Therefore you have something like:

   multiply([2,3,4,5,2,3],  2) *  4;  

When multiply calls itself in the else statement like multiply([2,3,4,5,2,3], 2) , this time n = 2. Remember n was 3 when we called multiply. It will enter the if statement which evaluates to false since n > 0. The else will be evaluated again, returning

 multiply(arr, n - 1) * arr[n - 1] //But n is 2

which is

 multiply([2,3,4,5,2,3],  1) *  3 // Since n is 2

You can see it has called itself again. Once again this return statement is paused. The process continues until you have something like this:

return multiply([2,3,4,5,2,3],  2) *  4;   //First return statement which is paused
return multiply([2,3,4,5,2,3],  1) *  3;   //Second return statement which is paused
return multiply([2,3,4,5,2,3],  0) *  2;   //Third return statement which is paused
return  1; //Final return statement. Since n = 0,  the base case is evaluated.

Take note, at the third return statement which is paused, you are calling
multiply with the arguments [2,3,4,5,2,3] and 0. Since n = 0, the if statement will evaluate to true hence returning 1 the base case. After the base case is evaluated move upwards replacing the function calls in the return statements which have been paused. The return statements will now become

return 1 * 2  *  3  *  4;   //Replace multiply([2,3,4,5,2,3],  2)  by  1 * 2 * 3
return  1 * 2 *  3;   //Replace multiply([2,3,4,5,2,3],  1) by 1 * 2
return  1  *  2;   //Replace multiply([2,3,4,5,2,3],  0) by 1
return  1; 

Finally returning 1 * 2 * 3 * 4
I hope that was helpful. Check the other links provide by @michaelsndr and @cubicoder above. HAPPY CODING!

2 Likes