concept / 001

Recursion

A function that calls itself — until it doesn't. Let's see exactly how that works.

The Big Idea
🪆
Russian Dolls
Each doll contains a smaller version of itself, until you hit the tiny solid one at the center.
🪞
Mirror in Mirror
Two mirrors facing each other create infinite reflections — but a real recursion always stops.
🧗
Climbing Stairs
"How many steps to the top?" = 1 + (how many steps from the next one). Same problem, smaller.
Two Rules (Always Both)

🛑 Base Case

The stopping condition. Without this, the function calls itself forever and crashes. It's the tiny solid doll at the center — no more recursion here.

🔄 Recursive Case

The function calls itself with a smaller input. Each call must move closer to the base case, or you'll recurse forever.

The Code — Factorial
factorial.js 
// 5! = 5 × 4 × 3 × 2 × 1 = 120

function factorial(n) {

  // 🛑 BASE CASE — stop here
  if (n === 0) {
    return 1;
  }

  // 🔄 RECURSIVE CASE — call myself with a smaller n
  return n * factorial(n - 1);
}

factorial(4); // → 24
Live Call Stack Visualizer
factorial(
)

📥 Call Stack

— empty —

📋 Execution Log

Common Pitfalls
♾️

Infinite recursion (stack overflow)

If your base case is never reached — maybe because n goes negative instead of reaching 0 — the function calls itself forever until the browser crashes with a "Maximum call stack size exceeded" error.

🐌

Redundant work without memoization

Naive recursive Fibonacci recalculates the same values over and over. fib(30) might make over a billion calls. The fix: cache results (memoization) or switch to iteration.