Recursion in JavaScript

Recursion is a common concept in coding and one everyone should understand down the road. I'd like to introduce it to anyone who's heard the term but isn't familiar with what it is or how it works within JavaScript.

So first thing is to talk about what it is. Recursion is where a function calls itself within itself. So when the function is invoked it calls itself. Which then calls itself. Which then calls itself. Which then.. you get the point.

const callMyself = () => {
  callMyself();
}

//DONT DO THIS IT WILL INFINITELY RUN
callMyself();

Sounds like an infinite loop right? Well that's because it is. So what's the point of doing that? Well there isn't.. unless you enable a way out of the infinite loop. This will come in the form of conditional statements such as our good friends if/else statements.

You can set this up so it either keeps recurring while a condition is true or it keeps recurring until it isn't true.

const callMyself = () => {
  if(condition){
    callMyself();
  } else {
    //Do something else besides invoking self
  }
}

A super common example and one that helps to visualize the concept is counting numbers up or down until a condition is met.

const newYearCountDown = (number) => {

  console.log(number);

  nextNumber = number--;

  if(nextNumber > 0){
    newYearCountDown(nextNumber);
  } else {
    console.log("Happy New Year!!!");
  }
}

So that's cool and all but counting can be done a great number of ways. The point is using recursion until a condition is met and using conditionals to exit the loop once the condition is satisfied.

A second common example when it comes to recursion is finding the factorial of a given number. A factorial is the product of a number and every number preceding it.

The factorial of 5 would be:

5 x 4 x 3 x 2 x 1 = 120

With recursion this would look like:

const factorial = (number) => {
  if (number <= 0) {
    return 1;
  } else {
    return number * factorial(number - 1);
  }
};

factorial(5);

//factorial(5) returns 5 * factorial(4)
//factorial(4) returns 5 * 4 * factorial(3)
//factorial(3) returns 5 * 4 * 3 * factorial(2)
//factorial(2) returns 5 * 4 * 3 * 2 * factorial(1)
//factorial(1) returns 5 * 4 * 3 * 2 * 1 * factorial(0)
//factorial(0) returns 120

So now that you have a grasp of what recursion is doing you might be thinking this is doing the same thing as a loop. It's true these things could be done with a loop or via iteration and a lot of the time in JavaScript those may be a more fitting solution than recursion. So when is recursion most useful?

Well one advantage is you can make your code a lot more readable if you use recursion. It can also shorten your code in some cases compared to loops. Some downsides with recursion is that it can take up more memory and produce slower code depending on usage.

That'll be it from me this week.. happy coding!