Introduction

In this article, I'll take you on a ride to see what recursion and recursive functions are, and how they work under the hood. Enjoy the ride!

What is Recursion?

Recursion is a concept where a function calls itself and keeps calling itself until something stops it from calling itself.

Recursive Function

Recursive function also works like a loop. In for loops, and while loops you have your condition for which as long as that condition remains true, a specific code keeps running until the condition becomes false. That is the same thing with a recursive function, the function keeps executing the code as long as the specified condition is true and if that condition remains true forever, just like we have infinite loops, we're also going to have infinite recursive function calls and will cause our application or browser to crash.

There are so many advanced use cases of recursive functions in JavaScript but I'll be using simple examples to simplify what recursive function means. Let's dive deep with a code simple code snippet.

function sayHello() {
    console.log("Hello") //Hello
    sayHello()// recursion
}

In the code snippet, we've declared a function that says "sayHello", and this function just logs "Hello" to the console and still calls the function after running the first line of code in the code block. That is what makes it a recursive function, just as we've mentioned in the beginning.

So, every time we call sayHello, it'll log "Hello" in the console and call "sayHello" gain, and this continues to print "Hello" in the console until our browser will crash. That is recursion happening under your watch.

When the maximum call stack is exceeded, our application or browser will crash because it's running an infinite function which we do not want in our application.

Let's understand how a for loop works before diving deep into another example of another recursive function.

for(let counter = 0; counter < 4; counter++) {
    console.log("Hello")
}

In the above code snippet, we've declared a value for the counter variable which is 0, and a condition that says the counter is less than 4. So, as long as the condition remains true the code will run seven times until the condition is false. We can do the same thing in recursive functions. So, with recursive functions, we can declare a base case.

What Is a Base Case?

A base case in a recursive function is the terminating point of that recursion. For example, the case could be a condition that if met at any point during the recursion, stops the recursion. Let's see how to declare a base case in the following code snippet.

let counter = 0;
function greetUser() {
    console.log("Hello user")
    counter++;
    console.log(counter)
    //base case below
    if(counter > 5) {
        return; // you can return anything
    }
   greetUser();
}
greetUser()

Outside the code block, we declared a variable called "counter" and initialized it to 0, In the code block, we console.log "Hello user", increased the counter by 1, and console.log counter then moved to the base case where it checks if the counter is greater than 5 then we return. This is going to tell the recursion that once it meets this base case then stop the recursion.

//console
Hello user
1
Hello user
2
Hello user
3
Hello user
4
Hello user
5
Hello user
6

After running your code, you'll clearly see that "Hello user" is logged and the counter variable is increased by one which makes it 1. Our code continues to run until the counter variable becomes 6, then our base case is met. So, the function stops calling itself.

Conclusion

Recursive functions can be used to execute some lines of code until a condition is met, which is the base case and when that is met, the recursive function stops. Recursive functions are not a replacement for loops but in some cases, they can be more effective than using for loops or while loops.

Hope you enjoyed reading this.