The Magic of Recursion in JavaScript ✨

Recursion is an easy-to-learn problem-solving approach. It's a bit difficult to understand, but once you get past that initial hurdle, it's super easy. Let's explore the vast unknown of recursion!

Recursion: A Story 📖

(Credits for this story to Colt Steele on his Udemy course)

Bear with me, this story will be pretty short but will teach some important lessons.

So there was a king who had a list of numbers (IDK why), which went as follows: [758, 890, 436, 912]

He asked a boy to tell him whether or not this list had any odd numbers. The boy, not even knowing what odd numbers are, approached a dragon for help. The dragon said he does know what odd numbers are, but he is way too tired. At once, he can only tell the boy whether or not the first number in the list is odd or even. This posed an obstacle to the little boy.

He came up with an idea. He asked the dragon to judge the original array. The dragon said the first number wasn't odd. The boy proceeded to ask the dragon again and asked him to judge this array: [890, 436, 912]

Yes, the boy decided to ask the dragon the same question, but only with a slightly modified dataset.

And again, he would just remove the first number from the list and proceed to ask the dragon the same question. In the end, when there were no numbers left, he confirmed that there were no odd numbers in the list.

This, my friends, is recursion.

Recursion in practice

Let's say you want to find the factorial of 5. That would equal 1 x 2 x 3 x 4 x 5, which is 120. Hence, 5! = 120. (5! indicates factorial of 5)

Let's see how we would solve this normally.

function factorial(n) {
    let count = 1
    for (let i = 1; i <= n; i++) {
        count *= i
    }
    console.log(count)
}

factorial(5)
// 120

This is very simple and I expect everyone reading this article to understand this. Now, for the fun part, let's implement factorials using recursion.

function factorial(n) {
    if (n == 1) {
        return n
    }
    return n*factorial(n-1)
}

console.log(factorial(5))
// 120

Whoa, wait, what's happening here? Let's explore this step-by-step:

1. 5 isn't equal to one, hence, 5*factorial(4) will be triggered.

2. 4 isn't 1 either, so 4*factorial(3) will be triggered.

And this goes on and on, until, n equals 1, when the chain reaction of 2x1 gets triggered, and then 2x3, and then 4x6, and then 5x24.

Magic, isn't it?

You must use this beautiful recursion visualizer, it's fun and you can better understand how recursion works.

Parts of a recursive function

There are two parts to a recursion function:

1. The base case

2. The function call

The purpose of the base case is to check whether we've reached a point where recursion is no longer necessary and we're returning a simple value. In our case, it's when we check whether or not n equals 1.

The function call calls the main function in itself, with a different input. In our case, we're reducing our input by 1 every time, and multiplying it with our original input.

---

I hope you enjoyed this article and understood how recursion works. If you'd like to learn more about JavaScript and coding, consider reading some of my other articles. I'm sure you'd learn a lot. Feedback is appreciated!