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 () и помещается в стек выполнения ... Теперь, когда 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 всегда синхронен.
