I've been learning about setTimeout and synchronous versus asynchronous code, I was watching a tutorial video where they showed various functions being called and added to the call stack, e.g. a function to simply add 2 numbers.

However for setTimeout they didn't show that when this was invoked that it was being added to the call stack, I understand that this fires up a web API and that the callback is added to a queue but I'm curious if in the moment that setTimeout is being executed by the JS engine, is it added to the call stack or not?

I've been learning about setTimeout and synchronous versus asynchronous code, I was watching a tutorial video where they showed various functions being called and added to the call stack, e.g. a function to simply add 2 numbers.

However for setTimeout they didn't show that when this was invoked that it was being added to the call stack, I understand that this fires up a web API and that the callback is added to a queue but I'm curious if in the moment that setTimeout is being executed by the JS engine, is it added to the call stack or not?

• javascript

3 Answers 3

in the moment that setTimeout is being executed by the JS engine, is it added to the call stack or not?

It is. And it is popped from the call stack as soon as the callback is registered, so this hardly takes any time.

When the given delay has passed, the callback will be queued. Then when the call stack is empty, JS will process the event queue, and the callback will be called. Also this callback will be added to the call stack.

Just note that setTimeout and the callback will not be added to the call stack cumulative. It is guaranteed that the call stack will be emptied first before the callback will be pushed unto it.

Yes, after the time set in timeout passes, the callback is pushed to the call stack & executed.

Actually, the only way for a JS function to execute is to pass through the call stack.

Here is a good visualization tool called loupe by Philip Roberts that may help in understanding the call stack & things related to it.

setTimeout would be pushed to the call stack and then popped. When it is popped, it is sent to a browser API (if the code is executed in the browser). The API waits till the specified time is done and the callback is sent to the event queue. When the call stack is empty, the event loop will take the callback from the event queue (assuming it was next in line in the queue) and put it to the stack when it then gets executed.