Output Questions: Event Loop & Async

The mental model before you start:

Call stack — synchronous code runs here, one frame at a time.
Microtask queue — Promise .then, .catch, .finally, async/await continuations, queueMicrotask. Drains completely after each task.
Macrotask queue (task queue) — setTimeout, setInterval, setImmediate (Node), I/O callbacks. One task per loop tick.

Order: current synchronous task → drain all microtasks → pick one macrotask → drain all microtasks → pick next macrotask → …

Q1 — the classic A/D/C/B

Run it yourself

Edit and run. Output is captured from console.log. Async logs (setTimeout/Promise) appear in real execution order.

console.log('A');

setTimeout(() => console.log('B'), 0);

Promise.resolve().then(() => console.log('C'));

console.log('D');

Console

Answer & why

A
D
C
B

A — synchronous, runs immediately.
B — setTimeout schedules a macrotask.
C — Promise.resolve().then schedules a microtask.
D — synchronous, runs immediately.
After the script finishes: drain microtasks → C fires.
Pick the next macrotask → B fires.

Q2 — Promise constructor is synchronous

Run it yourself

Edit and run. Output is captured from console.log. Async logs (setTimeout/Promise) appear in real execution order.

console.log('1');

new Promise((resolve) => {
console.log('2');   // ?
resolve('3');
console.log('4');   // ?
}).then((v) => console.log(v));

console.log('5');

Console

Answer & why

The executor function (the callback you pass to new Promise) runs synchronously. Only .then is asynchronous (microtask). So 2 and 4 log before the script reaches 5. After the script, the microtask runs and logs 3.

Q3 — chained promises ordering

Run it yourself

Edit and run. Output is captured from console.log. Async logs (setTimeout/Promise) appear in real execution order.

Promise.resolve()
.then(() => {
  console.log('A');
  return 'B';
})
.then((v) => console.log(v))
.then(() => console.log('C'));

Promise.resolve()
.then(() => console.log('D'));

console.log('E');

Console

Answer & why

E
A
D
B
C

Both chains queue their first .then as microtasks at the same time. After E (sync), the microtask queue is: [A-handler, D-handler].

A-handler runs → logs A, returns 'B' → queues B-handler.
D-handler runs → logs D.
B-handler runs → logs B, queues C-handler.
C-handler runs → logs C.

Microtasks interleave between chains — it’s a single FIFO queue.

Q4 — async/await unwrapping

Run it yourself

Edit and run. Output is captured from console.log. Async logs (setTimeout/Promise) appear in real execution order.

async function foo() {
console.log('1');
await Promise.resolve();
console.log('2');
}

console.log('3');
foo();
console.log('4');

Console

Answer & why

foo() starts synchronously: logs 1, then hits await. await suspends foo (schedules the continuation as a microtask) and returns control to the caller. The caller logs 4. After the synchronous script ends, the microtask queue runs and resumes foo → logs 2.

Q5 — await inside a loop (series not parallel)

Run it yourself

Edit and run. Output is captured from console.log. Async logs (setTimeout/Promise) appear in real execution order.

function delay(ms, val) {
return new Promise(r => setTimeout(() => r(val), ms));
}

async function run() {
console.log('start');
const a = await delay(0, 'A');
console.log(a);
const b = await delay(0, 'B');
console.log(b);
console.log('done');
}

run();
console.log('sync after run()');

Console

Answer & why

start
sync after run()
A
B
done

Each await suspends the async function. 'sync after run()' logs immediately after run() is called (before the first delay resolves). Then each delay resolves sequentially (because each await waits for the previous one).

Q6 — Promise.all vs sequential await

Run it yourself

Edit and run. Output is captured from console.log. Async logs (setTimeout/Promise) appear in real execution order.

function delay(ms, val) {
return new Promise(r => setTimeout(() => r(val), ms));
}

async function run() {
// Sequential (slow)
const a = await delay(100, 'A');
const b = await delay(100, 'B');
console.log('seq:', a, b);

// Parallel (fast)
const [c, d] = await Promise.all([delay(100, 'C'), delay(100, 'D')]);
console.log('par:', c, d);
}

run();

Console

Answer & why

seq: A B   (after ~200ms)
par: C D   (after ~300ms total, ~100ms after seq)

Sequential await means the second delay doesn’t even start until the first resolves. Total: 200ms. Promise.all starts both simultaneously — both fire at the same time. Total extra: 100ms. The ordering of these two logs is always seq then par.

Q7 — microtask flood

Run it yourself

Edit and run. Output is captured from console.log. Async logs (setTimeout/Promise) appear in real execution order.

setTimeout(() => console.log('timeout'), 0);

Promise.resolve()
.then(() => {
  console.log('p1');
  return Promise.resolve();
})
.then(() => {
  console.log('p2');
  return Promise.resolve();
})
.then(() => console.log('p3'));

console.log('sync');

Console

Answer & why

sync
p1
p2
p3
timeout

The microtask queue drains completely before any macrotask runs. Even though the chain creates new microtasks on the fly (each .then adds the next to the queue), they all resolve before the setTimeout callback fires. timeout always comes last.

Q8 — async error handling order

Run it yourself

Edit and run. Output is captured from console.log. Async logs (setTimeout/Promise) appear in real execution order.

async function fail() {
throw new Error('oops');
}

async function run() {
console.log('1');
try {
  await fail();
  console.log('2');    // ?
} catch (e) {
  console.log('3:', e.message);
}
console.log('4');
}

run();
console.log('5');

Console

Answer & why

1
5
3: oops
4

run() executes 1 synchronously, then hits await fail(). fail() throws synchronously but since it’s an async function, the error becomes a rejected Promise. await catches the rejection and resumes at the catch block as a microtask. Meanwhile 5 (sync) runs. Then the microtask fires: 3: oops, then 4.

2 never prints — await threw.

Q9 — nested async functions

Run it yourself

Edit and run. Output is captured from console.log. Async logs (setTimeout/Promise) appear in real execution order.

async function inner() {
console.log('inner start');
await Promise.resolve();
console.log('inner end');
return 'result';
}

async function outer() {
console.log('outer start');
const r = await inner();
console.log('outer end:', r);
}

outer();
console.log('sync');

Console

Answer & why

outer start
inner start
sync
inner end
outer end: result

outer logs outer start, calls inner. inner logs inner start, hits await — suspends. Control returns to outer, which also awaits inner. Control returns to the synchronous code → sync.

Microtask 1: inner resumes → inner end → returns 'result'. Microtask 2: outer resumes with r = 'result' → outer end: result.

Q10 — queueMicrotask vs Promise.resolve

Run it yourself

Edit and run. Output is captured from console.log. Async logs (setTimeout/Promise) appear in real execution order.

console.log('1');

setTimeout(() => console.log('2'), 0);

queueMicrotask(() => console.log('3'));

Promise.resolve().then(() => console.log('4'));

queueMicrotask(() => console.log('5'));

console.log('6');

Console

Answer & why

queueMicrotask adds directly to the microtask queue — same as Promise.resolve().then(…). All microtasks drain before the macrotask (setTimeout). The microtask queue order is FIFO: 3 was queued first, then 4 (from Promise.then), then 5.

Q11 — Promise.resolve with a thenable

Run it yourself

Edit and run. Output is captured from console.log. Async logs (setTimeout/Promise) appear in real execution order.

const p = Promise.resolve(
Promise.resolve('value')
);

p.then(v => console.log(v)); // ?
console.log('sync');

Console

Answer & why

sync
value

Promise.resolve(promise) returns the same promise when passed a native Promise — it doesn’t wrap it. The .then callback fires as a microtask after sync code. The value is 'value'. (Note: if you pass a thenable that’s not a native Promise, there’s an extra microtask tick — but for native Promises, it’s resolved immediately.)

Q12 — setTimeout(fn, 0) race with multiple promises

Run it yourself

Edit and run. Output is captured from console.log. Async logs (setTimeout/Promise) appear in real execution order.

console.log('start');

setTimeout(() => console.log('timeout 1'), 0);
setTimeout(() => console.log('timeout 2'), 0);

Promise.resolve().then(() => {
console.log('p1');
return Promise.resolve();
}).then(() => console.log('p2'));

console.log('end');

Console

Answer & why

start
end
p1
p2
timeout 1
timeout 2

Both setTimeout callbacks are macrotasks queued in order. Both .then callbacks are microtasks. After end (sync), the microtask queue drains fully (p1 → p2). Then macrotasks run one by one: timeout 1 → timeout 2.

The rule that never changes

Sync → microtasks (drain completely, including newly added ones) → one macrotask → microtasks again → next macrotask. Promise .then and await continuations are microtasks. setTimeout/setInterval are macrotasks. The microtask queue always beats the macrotask queue.

Output Questions: Event Loop & Async

Q1 — the classic A/D/C/B

Q2 — Promise constructor is synchronous

Q3 — chained promises ordering

Q4 — async/await unwrapping

Q5 — await inside a loop (series not parallel)

Q6 — Promise.all vs sequential await

Q7 — microtask flood

Q8 — async error handling order

Q9 — nested async functions

Q10 — queueMicrotask vs Promise.resolve

Q11 — Promise.resolve with a thenable

Q12 — setTimeout(fn, 0) race with multiple promises

References