Why JavaScript Doesn’t Wait: The Story Behind the Event Loop

There’s a moment when working with JavaScript where things stop behaving the way you expect.

You write code in order…

but the output comes out differently.

A setTimeout with 0 delay runs later.

A Promise runs before something you thought came first.

And it starts to feel like JavaScript is doing things out of order.

But it’s not.

It’s following a system.

That system is the event loop.

JavaScript Can Only Do One Thing at a Time

At its core, JavaScript is single-threaded.

It can only execute one piece of code at a time.

That means:

• no true parallel execution
• no multitasking inside the engine

So naturally, a question appears.

How does JavaScript handle things like:

• API calls
• timers
• user interactions

All happening “at the same time”?

Code Runs on the Call Stack

When JavaScript executes code, it uses something called the call stack.

Think of it as the place where functions are executed.

console.log("A")
console.log("B")

This runs in order:

A
B

Simple. Predictable.

But this only applies to synchronous code.

When Time Enters the Picture

Now consider this:

console.log("A")

setTimeout(() => {
  console.log("B")
}, 0)

console.log("C")

If JavaScript is single-threaded, what happens here?

Does it pause and wait?

No.

Instead, it delegates.

The Role of the Environment

Functions like setTimeout are not handled by JavaScript itself.

They are handled by the environment:

• browser
• Node.js

So when JavaScript sees setTimeout, it says:

“Handle this elsewhere, and let me know when it’s done.”

The timer runs outside the call stack.

Meanwhile, JavaScript continues executing:

A
C

The Callback Queue

When the timer finishes, the callback doesn’t run immediately.

It is placed into a queue.

Waiting.

But waiting for what?

Enter the Event Loop

The event loop is a simple but powerful idea.

It constantly checks:

Is the call stack empty?

If yes:

Take the next task from the queue and push it to the stack.

So after A and C finish, the stack becomes empty.

Then the event loop takes the callback:

console.log("B")

And executes it.

Final output:

A
C
B

Not All Tasks Are Equal

There’s another layer that often causes confusion.

Not all asynchronous tasks go into the same queue.

There are two important types:

• microtasks
• macrotasks

Microtasks: Higher Priority

These include:

• Promise.then
• queueMicrotask

They run as soon as the current execution finishes.

Before anything else.

Macrotasks: Lower Priority

These include:

• setTimeout
• setInterval
• DOM events

They run after microtasks are done.

When Order Feels Wrong

Consider this:

console.log("A")

setTimeout(() => console.log("B"), 0)

Promise.resolve().then(() => console.log("C"))

console.log("D")

You might expect B before C.

But the result is:

A
D
C
B

Because microtasks always run before macrotasks.

The Real Flow

Every cycle of JavaScript looks like this:

1. Run all synchronous code
2. When stack is empty → run all microtasks
3. Then run one macrotask
4. Repeat

This loop never stops.

That’s why it’s called the event loop.

Why This Is Hard to Remember

Most of the time, you don’t need to think about this.

Frameworks handle complexity.

Async behavior “just works”.

So your brain doesn’t keep this knowledge active.

It feels theoretical.

Until something breaks.

When It Becomes Real

The event loop becomes important when:

• execution order feels wrong
• state updates don’t happen immediately
• async behavior creates unexpected results

That’s when this mental model becomes a tool.

Not just knowledge.

A Better Way to Approach It

Instead of trying to memorize the event loop…

tie it to situations.

When something behaves unexpectedly, ask:

• is this async?
• is this a promise or a timeout?
• which queue is this using?

That’s when the concept sticks.

Because it becomes useful.

A Final Thought

JavaScript doesn’t run things out of order.

It runs them according to a system you don’t always see.

The event loop is that system.

It decides when something is ready to run.

And once you start noticing it…

what once felt confusing starts to feel predictable.