Member-only story

JavaScript Event Loop Explained — Understand Microtasks, Macrotasks, and Async Execution

JavaScript Mastery Series Part 24

Zayd Islam

4 min read10 hours ago

Read Part 23

Press enter or click to view image in full size

Why does this JavaScript code print Start , End , and only then Promise ?

console.log("Start");

setTimeout(() => console.log("Timeout"), 0);

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

console.log("End");

Output:

Start

End

Promise

Timeout

Even though the timeout is scheduled with a delay of zero, it doesn't execute immediately. To understand why, we need to understand one of JavaScript's most important concepts: the event loop.

JavaScript is often described as single-threaded. It executes one piece of JavaScript code at a time on its main execution thread.

But how can it handle timers, network requests, promises, and user interactions without blocking everything?

The answer is the event loop .

1.…