От чего зависит порядок чтения строк в Javascript?

Question

Этот пример был приведен в виде ожидания 1, 2, 3 в качестве порядка выполнения этих функций, но на самом деле это 1, 3, 2. Любопытно, почему функция setTimeout будет выполняться последней?

console.log(1)
setTimeout(() => console.log(2), 0)
console.log(3)

Answer 1

Асинхронные обратные вызовы, такие как обратный вызов, переданный setTimeout() выше, помещаются в очередь, которая будет вызвана, когда основное синхронное тело сценария завершится.

Итак, заказ:

console.log(1)
setTimeout() // but not the callback
// put callback in queue
console.log(2)

// take item from queue and run
() => console.log(2)

Одним из следствий этого является то, что время, переданное setTimeout, является минимальным временем до срабатывания обратного вызова. Если основные синхронные задачи занимают больше времени, обратный вызов срабатывает поздно.

Это можно продемонстрировать, запустив длительный цикл while. (Но пожалуйста никогда не делайте этого в реальном коде)

let start = Date.now()
let now = start
let then = now + 3000;
   
// set timer for 100ms
setTimeout(() => console.log("timeout fired ater", Date.now() - start, "milliseconds"), 100)

// slow while loop takes 3000ms
while (now < then){
  now = Date.now()
}
console.log("loop done")

Answer 2

Обратный вызов на setTimeout является асинхронным, поэтому он, вероятно, зарегистрирован для запуска *, но это занимает достаточно много времени, чтобы зарегистрировать, что console.log(3) успеет выполнить эту точку.

При работес асинхронным кодом вы часто не можете гарантировать точный порядок, в котором он будет выполняться.

* Честно говоря, я не знаю внутреннюю часть setTimeout, и это, вероятно, будет зависеть от точной реализации, используемой в любом случае,Дело в том, что его обратный вызов выполняется асинхронно.