Recursion Explained In Simple Terms

Most tutorials explain recursion using factorials or Fibonacci sequences. That’s nice for learning, but you won’t use those in real work. Let’s look at recursion through actual code you might write.

Think of recursion like reading through a thread of Slack comments. You see a message with replies, and those replies have their own replies, and it keeps going deeper. Each level of replies is the same thing - just messages and responses - but each level is dealing with a smaller piece of the conversation.

In programming, recursion works the same way. A function calls itself to handle a smaller version of the same task. Here’s a Slack comment system to see how recursion works.

1
const thread = {
2
    message: "Should we deploy on Friday?",
3
    replies: [
4
        {
5
            message: "Never deploy on Friday!",
6
            replies: [
7
                {
8
                    message: "Unless it's a critical hotfix",
9
                    replies: [
10
                        {
11
                            message: "Even then, wait till Monday",
12
                            replies: []
13
                        }
14
                    ]
15
                }
16
            ]
17
        },
18
        {
19
            message: "Let's do it Monday",
20
            replies: []
21
        }
22
    ]
23
};
24

25
function displayThread(comment, depth = 0) {
26
    // Base case: if there's no comment, stop
27
    if (!comment) return;
28

29
    // Display the current comment with proper indentation
30
    console.log(`${' '.repeat(depth * 2)}${comment.message}`);
31

32
    // Handle each reply (recursive case)
33
    comment.replies.forEach(reply => {
34
        displayThread(reply, depth + 1);
35
    });
36
}
37

38
displayThread(thread);

This code would output:

1
Should we deploy on Friday?
2
  Never deploy on Friday!
3
    Unless it's a critical hotfix
4
      Even then, wait till Monday
5
  Let's do it Monday

That’s all recursion is - a function that calls itself to handle smaller pieces of data. In our example, it’s showing a comment, then showing all its replies, then their replies, and so on.

Every recursive function needs two crucial parts:

1. Something it’s trying to do (like displaying a comment)
2. A “base case” that tells it when to stop (when there are no more replies)

Think of it like this: if someone asks you to count all the comments in a Slack thread, you might say “Okay, I’ll count this comment (1), then count all the replies, then count their replies…” That’s recursion - breaking down a big task into smaller, similar tasks.

File Explorers and Directory Trees

The most common place you’ll use recursion is when dealing with files and folders. Think about Windows Explorer or Finder on Mac. They both need to show you files inside folders, which can have more folders inside them, and more folders inside those… you get the idea.

1
function listFiles(folder) {
2
    const files = [];
3

4
    function look(dir) {
5
        const items = fs.readdirSync(dir);
6

7
        items.forEach(item => {
8
            const path = dir + '/' + item;
9

10
            if (fs.statSync(path).isDirectory()) {
11
                look(path);  // Found a folder? Look inside it
12
            } else {
13
                files.push(path);  // Found a file? Add it to our list
14
            }
15
        });
16
    }
17

18
    look(folder);
19
    return files;
20
}

This function looks in a folder. If it finds a file, it adds it to the list. If it finds another folder, it looks inside that one too.

A Store Category Menu

The category menu in an online store works just like nested folders. Electronics contains Computers, which contains Laptops. Each category can hold more categories inside it.

1
const menu = {
2
    name: "Store",
3
    categories: [
4
        {
5
            name: "Electronics",
6
            categories: [
7
                {
8
                    name: "Computers",
9
                    categories: [
10
                        { name: "Laptops", categories: [] },
11
                        { name: "Desktops", categories: [] }
12
                    ]
13
                },
14
                {
15
                    name: "Phones",
16
                    categories: [
17
                        { name: "iPhones", categories: [] },
18
                        { name: "Android", categories: [] }
19
                    ]
20
                }
21
            ]
22
        }
23
    ]
24
};
25

26
function showCategories(item, depth = 0) {
27
    const spaces = "  ".repeat(depth);
28
    console.log(`${spaces}${item.name}`);
29

30
    item.categories.forEach(category => {
31
        showCategories(category, depth + 1);
32
    });
33
}
34

35
showCategories(menu);

Running this code shows:

1
Store
2
  Electronics
3
    Computers
4
      Laptops
5
      Desktops
6
    Phones
7
      iPhones
8
      Android

The showCategories function looks at each category and then peers inside it for more categories.

It starts at “Store” and prints it. Inside Store it finds “Electronics”, prints that with some space to show it’s inside Store. This pattern continues - looking inside each category and printing what it finds - until it hits empty categories. The spaces at the start of each line show how deep the category sits in the menu.

Essentially, recursion is just a way to handle nested data - like comments with replies, or folders with more folders inside. Don’t overcomplicate it. If you can break down your problem into smaller, similar problems, recursion might be the right tool for the job.