Why setTimeout(function, 0) is executed after next operation, but not in the moment of calling?

Question

I run this code in JavaScript:

setTimeout(function(){console.log("1");}, 0);
console.log("2");

But output is:

2
1

Why not vice versa?

Answer 1

Simply because the callback function of the setTimeout method is executed later.

1. setTimeout(..)

   Althought you specify 0 the callback function is not immediately executed. See https://stackoverflow.com/a/779785/2391070

2. console.log("2") // 2

3. setTimeout calls callback and console.log("1") // 1

Answer 2

The setTimeout() puts all the code in a queue, and then later based on the time, it executes. So you can see the list of procedures to execute as a line of queue. For the above code, you have:

1. setTimeout
2. console.log(2)
3. Callback Functions, if any.
   1. console.log(1)

So, first thing that executes is, initialize the timer. Secondly, the console.log gets executed and you see 2. An interesting thing to note here is, setTimeout waits at least for 4 ms before executing its callback function.

Answer 3

When you use setTimeout() or one of its friends, its function is placed on a queue to be executed after all the current code has finished.

It should be noted that the spec says the minimum time is clamped to 4.