Trace Tasks and Promise Handlers
Trace Tasks and Promise Handlers
The current synchronous job finishes before queued promise handlers run. In this small browser/Node example, the promise handler runs before the timer callback. This explains why starting a request does not pause every later statement.
Before this topic, review Catch an Asynchronous Failure if its terms are unfamiliar.
What you’ll learn
- Explain trace tasks and promise handlers through the school example.
- Trace the shown operations and distinguish their result from displayed output.
- Make the practice change and explain its consequence: Only the handler's message changes; its place after synchronous work and before this timer remains.
Work through the school example
This is JavaScript using language features and the host console. Read the initial values, then follow each operation to its displayed result. A declaration names a value, a function call performs an operation, and console.log displays its arguments.
JavaScript · school.js · complete example
console.log("Start");
setTimeout(() => console.log("Timer"), 0);
Promise.resolve().then(() => console.log("Promise"));
console.log("End");
Expected output
Start
End
Promise
TimerFollow the displayed order
JavaScript · source for this model
console.log("Start");
setTimeout(() => console.log("Timer"), 0);
Promise.resolve().then(() => console.log("Promise"));
console.log("End");
This diagram follows the supplied example. It is an explanatory model, not a JavaScript engine or a timing guarantee.
Follow the displayed order
Start the current job
Print Start and register a timer.
StartRegister a promise handler
Queue its continuation; continue synchronous execution.
StartFinish synchronous work
Print End, then run the queued promise handler.
Start End PromiseRun the timer callback
This eligible timer runs after the handler in this example.
Start End Promise Timer
Recognize the important boundary
Do not generalize this small trace into exact timing or all Node scheduling APIs. Long synchronous work still blocks this thread; microtask chains can postpone later tasks.
Try a small variation
JavaScript · original source for practice
console.log("Start");
setTimeout(() => console.log("Timer"), 0);
Promise.resolve().then(() => console.log("Promise"));
console.log("End");
Your task: Replace 'Promise' with 'Result ready'. Predict the result before running the edited program.
The source is repeated here. If the edit targets the HTML rather than the script, use the markup repeated below; the worked answer also repeats the changed markup.
Worked answer and reasoning
Only the handler's message changes; its place after synchronous work and before this timer remains.
JavaScript · complete worked variation
console.log("Start");
setTimeout(() => console.log("Timer"), 0);
Promise.resolve().then(() => console.log("Result ready"));
console.log("End");
Expected output
Start
End
Result ready
TimerPredict the original program
JavaScript · original program for this question
console.log("Start");
setTimeout(() => console.log("Timer"), 0);
Promise.resolve().then(() => console.log("Promise"));
console.log("End");
Check the important distinction
Keep the useful idea
The current synchronous job finishes before queued promise handlers run. In this small browser/Node example, the promise handler runs before the timer callback. This explains why starting a request does not pause every later statement.
Check your variation against this explanation: Only the handler's message changes; its place after synchronous work and before this timer remains.
Use the JavaScript array reference library for individual array operations and boundary tests to check a rule independently.
Reaching the recap and completing the quizzes are separate milestones.