Когда JavaScript является синхронным?



У меня сложилось впечатление, что JavaScript всегда был асинхронным. Однако я узнал, что есть ситуации, когда это не так (т. е. манипуляции DOM). Есть ли хорошая ссылка где-нибудь о том, когда она будет синхронной и когда она будет асинхронной? Влияет ли jQuery на это вообще?

453   3  

3 ответов:

JavaScript всегда синхронный и однопоточный. Если вы выполняете блок кода JavaScript на странице, то никакой другой JavaScript на этой странице в настоящее время не будет выполнен.

JavaScript является асинхронным только в том смысле, что он может выполнять, например, вызовы Ajax. Вызов Ajax прекратит выполнение, и другой код сможет выполняться до тех пор, пока вызов не вернется (успешно или иначе), после чего обратный вызов будет выполняться синхронно. Никакой другой код не будет работать в этот момент. Он не будет прерывать любой другой код, который в настоящее время выполняется.

JavaScript таймеры работают с этим же видом обратного вызова.

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

jQuery имеет опцию на Ajax вызовы, чтобы сделать их синхронно (с ). У новичков может возникнуть соблазн использовать это неправильно потому что это позволяет использовать более традиционную модель программирования, к которой можно было бы больше привыкнуть. Причина, по которой это проблематично, заключается в том, что этот параметр будет блокировать все JavaScript на странице до ее завершения, включая все обработчики событий и таймеры.

JavaScript является однопоточным и синхронной модели выполнения. Однопоточный означает, что одновременно выполняется одна команда. Синхронные средства по одному, т. е. одна строка кода выполняется в то время, когда появляется код. Так что в JavaScript одна вещь происходит одновременно.

Контекст Исполнения

движок JavaScript взаимодействует с другими движками в браузере. В стеке выполнения JavaScript существует глобальный контекст внизу, а затем, когда мы вызываем функции, движок JavaScript создает новые контексты выполнения для соответствующих функций. Когда вызываемая функция выходит из контекста выполнения, он извлекается из стека, а затем извлекается следующий контекст выполнения и т. д...

function abc()
{
   console.log('abc');
}


function xyz()
{
   abc()
   console.log('xyz');
}
var one = 1;
xyz();

в приведенном выше коде будет создан глобальный контекст выполнения и в этом контексте var one будет сохранен и его значение будет 1... когда вызов xyz() вызывается, то новый будет создан контекст выполнения, и если бы мы определили какую-либо переменную в функции xyz, эти переменные были бы сохранены в контексте выполнения xyz(). В функции xyz мы вызываем abc (), а затем создается контекст выполнения abc () и помещается в стек выполнения... Теперь, когда АВС() заканчивает свою контекста выталкивается из стека, то XYZ (с) контекст выталкивается из стека, а затем глобальном контексте будет неизбежно...

теперь об асинхронных обратных вызовах; асинхронный означает более одного разом.

так же, как стек выполнения есть Очереди Событий. Когда мы хотим получать уведомления о каком-либо событии в движке JavaScript, мы можем слушать это событие, и это событие помещается в очередь. Например, событие запроса Ajax или событие запроса HTTP.

всякий раз, когда стек выполнения пуст, как показано в приведенном выше примере кода, механизм JavaScript периодически просматривает очередь событий и видит, есть ли какое-либо событие для уведомления о. Например, в очереди было два события, запрос ajax и запрос HTTP. Он также смотрит, есть ли функция, которая должна быть запущена на этом триггере события... Таким образом, движок JavaScript уведомляется о событии и знает соответствующую функцию для выполнения этого события... Таким образом, движок JavaScript вызывает функцию обработчика, в примере, например, AjaxHandler() будет вызван и, как всегда, когда функция вызывается, ее контекст выполнения помещается на контекст выполнения и теперь выполнение функции завершается, а запрос ajax события также удаляется из очереди событий... Когда AjaxHandler() завершает выполнение, стек пуст, поэтому механизм снова смотрит на очередь событий и запускает функцию обработчика событий HTTP-запроса, которая была следующей в очереди. Важно помнить, что очередь событий обрабатывается только тогда, когда стек выполнения пуст.

например, см. код ниже, объясняющий стек выполнения и очередь событий обработка с помощью движка Javascript.

function waitfunction() {
    var a = 5000 + new Date().getTime();
    while (new Date() < a){}
    console.log('waitfunction() context will be popped after this line');
}

function clickHandler() {
    console.log('click event handler...');   
}

document.addEventListener('click', clickHandler);


waitfunction(); //a new context for this function is created and placed on the execution stack
console.log('global context will be popped after this line');

и

<html>
    <head>

    </head>
    <body>

        <script src="program.js"></script>
    </body>
</html>

теперь запустите веб-страницу и нажмите на страницу, и посмотреть вывод на консоли. Выход будет

waitfunction() context will be popped after this line
global context will be emptied after this line
click event handler...

движок JavaScript запускает код синхронно как описано в части контекста выполнения, браузер асинхронно помещает вещи в очередь событий. Таким образом, функции, выполнение которых занимает очень много времени, могут прерывать обработку событий. Все происходит в браузере события обрабатываются таким образом JavaScript, если есть прослушиватель, который должен запускаться, движок будет запускать его, когда стек выполнения пуст. И события обрабатываются в том порядке, в котором они происходят, поэтому асинхронная часть касается того, что происходит вне двигателя, т. е. что должен делать двигатель, когда происходят эти внешние события.

поэтому JavaScript всегда синхронен.

JavaScript является однопоточным, и все время вы работаете над обычным синхронным выполнением потока кода.

хорошими примерами асинхронного поведения, которое может иметь JavaScript, являются события (взаимодействие с пользователем, результаты запроса Ajax и т. д.) и таймеры, в основном действия, которые могут произойти в любое время.

Я бы рекомендовал вам взглянуть на следующую статью:

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

асинхронный http://ejohn.org/files/427px-Timers.png

Comments

    Ничего не найдено.