What is the difference between synchronous and asynchronous code?

Q: What is the difference between synchronous and asynchronous code?

**Target Audience:** Engineers preparing for JavaScript fundamentals/event-loop interviews. **Difficulty:** Medium > **How to read this doc:** Concepts are explained in plain language first, then tagged with 📌 Interview term: . The exact ordering below was actually run in Node — not recited from a diagram. ## 1. Why This Even Matters — A Story First Ordering food at a counter is synchronous: you stand there, place your order, and nothing else happens until the cashier finishes ringing it up — you are genuinely blocking the line behind you. Ordering food at a restaurant with table service is asynchronous: you place your order, then continue your conversation, reading the menu, whatever else — the kitchen works in the background, and your food (the "result") arrives later via a specific delivery mechanism (the waiter, standing in for a callback or Promise). ## 2. The Core Idea 📌 **Interview term:** synchronous code runs top to bottom, each statement blocking the next.

The problem

Question presented to candidate: "Walk me through, in exact order, what actually prints if a function has a console.log, then a setTimeout(fn, 0), then a Promise.then(fn), then another console.log — and explain why that order happens."

What a strong answer should cover:

📌 Interview term: synchronous code — executes one statement at a time, top to bottom, each statement genuinely blocking the next from starting until it completes.
📌 Interview term: asynchronous code — lets long-running or externally-triggered work (a timer, a network request, a file read) happen without blocking the rest of the program; the result is delivered later via a callback, a Promise, or async/await.
📌 Interview term: the real, direct answer to the prompt — verified directly: given a synchronous log, a setTimeout(fn, 0), a Promise.then(fn), and a second synchronous log, the real observed order was all synchronous code first (both logs), then the Promise callback, then the setTimeout callback — never interleaved any other way.
📌 Interview term: the microtask/macrotask distinction — a precise answer names WHY the Promise callback ran before the setTimeout callback despite both being "asynchronous": Promise callbacks are microtasks, which the event loop always fully drains before running the next macrotask (which is what a setTimeout callback is), even a setTimeout with a 0ms delay.
A precise answer names that "asynchronous" does not mean "runs on a separate thread" — JavaScript itself is single-threaded; asynchronous operations are handled by the surrounding runtime (browser APIs or Node's libuv), which schedules their callbacks back onto the same single JS thread once ready.

Clarifying questions expected:

None — this is a definitional/comparison question; producing the exact real ordering (not just "sync runs first, async runs later") is the strong signal.

Code / implementation expected: Yes — reproducing the exact real console.log order for the prompt's own scenario is the clearest, most convincing demonstration.

sync-async

Try it yourself

Sketch your approach before you read the solution. That is what the interview tests.

Stuck? Get a hint.

A short nudge toward the approach. It will not give the answer away.

Solution

Target Audience: Engineers preparing for JavaScript fundamentals/event-loop interviews. Difficulty: Medium

How to read this doc: Concepts are explained in plain language first, then tagged with 📌 Interview term:. The exact ordering below was actually run in Node — not recited from a diagram.

1. Why This Even Matters — A Story First

Ordering food at a counter is synchronous: you stand there, place your order, and nothing else happens until the cashier finishes ringing it up — you are genuinely blocking the line behind you. Ordering food at a restaurant with table service is asynchronous: you place your order, then continue your conversation, reading the menu, whatever else — the kitchen works in the background, and your food (the "result") arrives later via a specific delivery mechanism (the waiter, standing in for a callback or Promise).

2. The Core Idea

📌 **In

The solution is hidden so you can try first

6 min read · 8 sections

Run the code

Edit the code and run it here. Each console line with an expected value becomes a test.

JavaScriptReal proof of the exact synchronous-then-microtask-then-macrotask execution order