The difference between using setTimeout(fn, 0) and not using it

Question

I have a simple question about setTimeout function

My function:

function myFunc(){
   // some code here
}

What's different when

I call a function with and without setTimeout:

myFunc();
setTimeout(function(){
   myFunc();
}, 0);

Can someone explain help me? Thank you.

if you call it with `setTimeout` the browser will finish any current tasks first, and then run your function (asynchronously) — Alnitak, Jul 08 '19 at 10:56
With `setTimeout` it will be executed *sometime later* (very soon), so other things may happen in the meantime… — deceze, Jul 08 '19 at 10:56

score 1 · Answer 1 · answered Jul 08 '19 at 10:57

setTimeout waits for a given delay then schedules a new task for its callback. This is why setTimeout is logged after script end, as logging script end is part of the first task, and setTimeout is logged in a separate task. Right, we're almost through this, but I need you to stay strong for this next bit…

Tasks are scheduled so the browser can get from its internals into JavaScript/DOM land and ensures these actions happen sequentially. Between tasks, the browser may render updates. Getting from a mouse click to an event callback requires scheduling a task, as does parsing HTML, and in the above example, setTimeout.

https://jakearchibald.com/2015/tasks-microtasks-queues-and-schedules/

score 0 · Answer 2 · answered Jul 08 '19 at 11:02

setTimeout(,0) will call after all current queue will be finished, and normal function call goes in the queue first.

You can see here:

function myFunc1(){
   console.log("In myFunc1");
}

function myFunc2(){
   console.log("In myFunc2");
}

setTimeout(function(){
   myFunc1();
}, 0);

myFunc2();

The difference between using setTimeout(fn, 0) and not using it

2 Answers2