Recursion in JavaScript💛: Explain Like I'm five

Recursion can be so confusing mahn 😪

If you're a CodeNewbie or you're like me you probably didn't understand recursion the first time you learned about it 😆

Here's a mini-tutorial on how recursion works.

Let's dive right in!!

What is Recursion?? 🤨

According to Wikipedia Recursion occurs when a thing is defined in terms of itself or of its type.

Sounds confusing right??😆

But in the most basic terms, Recursion is when a function keeps calling itself until it doesn't have to anymore i.e The function has already reached its base case.

Now, What is a base case?

A base case is a condition that tells a recursive function when to stop calling itself, so as to terminate the loop and avoid infinite recursion.

Here's what a recursive function looks 🤩👇🏻

function recursion() {
    //This is a base case 👇🏻
    if (true) {
        return;
    }
    //Recursively call the function
    recursion()
}

If you noticed we've defined the base case first because the function needs to know when it's going to stop calling itself. If not the function will keep running and will cause what we call infinite recursion which can crash your browser.

Let's dive right into more examples😁💛.

Here we're going to write a program that counts down from a certain number or inputs.

function countdown(number) {
    //base case
    if (number === 0) {
        return;
    }
    console.log(number);
    //Recursively call the function
    return countdown(number - 1);
}
console.log(countdown(7)) // 7, 6, 5, 4, 3, 2, 1

What is going on here??😬😬

Don't fret!! As you can see we defined the base case first, then the recursive part of it happens on the seventh line where we tell the function to keep returning itself but reducing the number by one every time until the number is equal to zero.

So this is what is going on in the function above 💛

• The current input is 7
• Is 7 equal to 0?
• No, Ok so let's log 7 to the console
• It calls Itself again with (number - 1) OR (7- 1)
• The current input is 6
• Is 6 equal to 0?
• No, Ok so let's log 6 to the console
• The same process repeats until input is 0 so the function stops calling itself.

That made some sense right?, Let's try some other examples😁

You know how we can use the remainder operator (%) to know if a number is "Even" or "Odd" So if number % 2 == 0 then that number is even or if number % 3 == 0 then that number is odd

We can also use recursion to write a program that checks if a number is even or odd🤯👇🏻

let oddOrEven = (number) => {
    if (number === 0) {
        return 'Even';
    } else if (number === 1) {
        return 'Odd';
    } else {
        return oddOrEven(number % 2);
    }
};
console.log(oddOrEven(20)) // Even
console.log(oddOrEven(75)) // Odd
console.log(oddOrEven(98)) // Even
console.log(oddOrEven(113)) // Odd

Also effectively, this's what's going on in the Function above

The first step was to tell the function when to stop calling itself i.e we defined the base case. Then we told it what to do when it calls itself.

Let's say the input is equal to 10. The function keeps subtracting 2 from 10 till it reaches its base case i.e (10 - 2 - 2 - 2 - 2 - 2 = 0) returns "Even"

But if the input is equal to 15 the function keeps subtracting 2 from 15 till it reaches its base case i.e (15 - 2 - 2 - 2 - 2 - 2 - 2 - 2 = 1) returns "Odd"

Recursion and loops

Recursion works pretty much like loops but loops are way faster but Recursive functions are very efficient and also Loops can't do all the things a recursive function can do.

So it's up to you what you want to choose😊

YEAH!!! that's pretty much it about recursion😊

Of course, there's a lot more to recursion than these basic concepts, but you can easily get through the rest when you understand the basics.

Thanks for making it through the end of this article and trying to understand this complex concept.

I hope this post helps you to understand recursion to some extent

Happy coding! 🤗