Callback Hell and Pyramid of Doom in JavaScript

Callback Hell happens when you have too many nested callbacks, making your code:

Hard to read

Hard to debug

Hard to maintain

It's also called the Pyramid of Doom because the code starts to indent like a pyramid .

Example: Callback Hell

Imagine you’re doing 3 things in order:

Order a pizza

Make a drink

Watch a movie

Each task takes time (simulated by setTimeout), and we use callbacks to make sure they happen in order.

Example:-

setTimeout(() => {
  console.log(" Ordered pizza");

  setTimeout(() => {
    console.log(" Made a drink");

    setTimeout(() => {
      console.log(" Started the movie");

    }, 1000); // watch movie
  }, 1000);   // make drink
}, 1000);     // order pizza

Output:-

Ordered pizza
 Made a drink
 Started the movie

The output is correct — but look at the code! It's deeply nested and becomes messy fast!

Why You Should Avoid Callback Hell

How to Fix Both?

Use named functions

Use Promises

Use async/await

function watchMovie() {
  setTimeout(() => {
    console.log(" Started the movie");
  }, 1000);
}

function makeDrink() {
  setTimeout(() => {
    console.log(" Made a drink");
    watchMovie();
  }, 1000);
}

function orderPizza() {
  setTimeout(() => {
    console.log(" Ordered pizza");
    makeDrink();
  }, 1000);
}

orderPizza();