Возможно, вы уже знаете, что JavaScript — это однопоточная языковая модель, хотя вы можете слышать о рабочих потоках в NodeJS.
Но его выполнение приложения является одним потоком. Это означает, что если вы загружаете страницу в браузере, и эта страница выполняет какие-то вычисления, это делает только один поток. Итак, все, что вы видите в браузере (js, вычисляемые стили, рисование), все это работает только одним потоком. Давайте просто разберем это на примере:
Предположим, вы открыли страницу, содержащую HTML и одну или две кнопки, на которые можно нажать. Как вы уже знаете, он будет выполнять команды по одной. Итак, если пользователь нажимает кнопку, например, он выполняет какие-то вычисления, а тем временем пользователь нажимает другую кнопку, как вы думаете, что произойдет на этой странице 🤔?
если поток уже занят какими-то другими задачами, следующие задачи будут поставлены в очередь для следующего выполнения. Когда поток завершит свою первую задачу, он получит первый элемент в очереди и будет выполнять его до тех пор, пока очередь не станет пустой.
Таким образом, это цикл, который проверяет, пуста ли очередь событий. Это основная концепция цикла событий.
Синхронное событие:
Хорошо, теперь нам нужно понять, как в цикле событий Js выполняет задачу. Например, мы используем синхронный код, который блокирует код, и у нас много зависимых обратных вызовов. Это означает, что мы написали функцию, которая зависит от другой функции и также зависит от результатов другой функции. В этом случае JavaScript управляет этим с помощью структуры данных Stack с именем CALL STACK.
const function3 = () => { console.log('Massive Sync Callbacks'); }; const function2 = { console.log('DB CALL'); callback(); }; const function1 = { console.log('File System Calls'); callback(function3); }; function1(function2);
Асинхронноесобытие:
Итак, теперь мы будем делать этот же пример асинхронным способом. Асинхронное выполнение действий очень мощно и эффективно с точки зрения одновременного выполнения нескольких действий. Когда событие принимается потоком для выполнения, он видит, что стеки вызовов зависимых задач запускают асинхронные обратные вызовы, и продолжает выбирать следующую задачу из очереди событий. Таким образом, если предположить, что у нас есть 2/3 вызовов БД, то мы будем писать эти обратные вызовы асинхронно, чтобы всякий раз, когда выборка БД заканчивалась, она снова ставилась в очередь в цикле событий для обработки потоком.
Если вам нужно хорошее видео-объяснение, вы можете проверить это.
Что, черт возьми, такое цикл событий? | Филип Робертс | JSConf ЕС
Первоначально опубликовано на https://pritompurkayasta.me.
