2016-04-18 2 views
1
console.log('one'); 
setTimeout(function() { 
    console.log('two'); 
}, 0); 
console.log('three'); 

Выход: 'один' 'три' 'два'Почему существует задержка, даже если setTimeout установлен на 0 задержку?

Что происходит за кулисами? Почему код производит этот вывод?

+4

Вы можете прочитать на этих http://stackoverflow.com/questions/779379/why-is-settimeoutfn-0-sometimes-useful –

ответ

5

setTimeout() Не выполняйте данную функцию «Через X секунд после этого вы объявите это», «За кулисами» этот метод помещает заданную функцию в стек, который будет выполнен «X секунд после этого, код в выполнении контекст были выполнены, в данном случае, когда линия 1 и линия 4 вашего кода была выполнена»

в качестве примера

setTimeout(function() { 
    console.log('four'); 
}, 10); 
console.log('one'); 
setTimeout(function() { 
    console.log('two'); 
}, 0); 
console.log('three'); 

// Вывод:„один“,„три“," два ',' четыре '

За кулисами:

В контексте выполнения

console.log('one'); 
console.log('three'); 

после контекста выполнения setTimeout(fn, ms) сортировки в порядке второго параметра в миллисекундах:

console.log('two');//0 ms after the execution context has been executed. 
console.log('four'); //10ms after the execution context has been executed 

EDIT: Были искать ссылку, в следующий ответ объясняет графически, как работает очередь javascript-браузера, проверьте это!

2

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

Так интерпретатор выполняет это следующим образом:

get and execute next event 
    calling your global <script> code 
    calling console.log('one'); 
    calling setTimeout(func); 
    calling console.log('three'); 
    returning from your global <script> code 
get and execute next event* 
    calling setTimeout callback 
    calling console.log('two'); 
    returning from setTimeout callback 

(*): Там могут быть и другие функции обратного вызова помещается в очередь назвать между этими двумя.

1

Javascript использует цикл событий для выполнения асинхронного кода. Javascript однопоточный, поэтому все обратные вызовы запускаются один за другим с помощью очереди обратного вызова. Код работает в серии «тиков». Это означает, что обработка очереди происходит только тогда, когда предыдущая завершена. Здесь setTimeout регистрирует обратный вызов и возвращает. Следующие строки кода должны быть выполнены, чтобы они выполнялись сначала в этом стеке вызовов. После того, как ничего не будет выполнено, только тогда зарегистрированный обратный вызов будет выполнен.

визуальное объяснение дается здесь: http://latentflip.com/loupe/?code=Y29uc29sZS5sb2coJ29uZScpOwpzZXRUaW1lb3V0KGZ1bmN0aW9uKCkgewogIGNvbnNvbGUubG9nKCd0d28nKTsKfSwgMCk7CmNvbnNvbGUubG9nKCd0aHJlZScpOw%3D%3D!!!PGJ1dHRvbj5DbGljayBtZSE8L2J1dHRvbj4%3D

+0

Великая ссылка, спасибо! –

Смежные вопросы