Event Loop та асинхронні операції в JavaScript

JavaScript – однопотокова мова програмування, проте при деяких умовах можна створити багатопотоковість. Як це відбувається та що як створити ілюзію асинхронності в JS далі.

Як відбувається асинхронність

Якщо коротко і стисло, асинхронність в JavaScript організована не самою мовою програмування, а на основі середовища та його додаткового функціонала. Наприклад, у браузерах є спеціальний API, що містити роботу з асинхронними операціями (SetTimeout, Geolocation API й так далі).

Цикл подій або Event Loop

Цикл подій (Event Loop) – постійний цикл, що “моніторить” наявність завдань та при появі виконує їх. Якщо в процесі виконання з’являється інше завдання, воно потрапляє в чергу, і згодом також виконується.

Якщо виконується якась асинхронна операція, спровокована викликом SetTimeout, Promise і тд., вона перенесеться в так звану Callback Queue(Чергу коллбеків), і виконається пізніше.

Мікро та макрозавдання

Макрозавдання виконуються в процесі появи завдань в Cass Stack. Тобто якщо якесь синхронне завдання залетіло в стек, в потім добавилось “асинхронне” (колбек з SetTimeout і так далі), вони виконаються першими.

У випадку виконання Promise’ів, або використання MutationObserver, такі операції виконаються пізніше, і описані в стандарті як мікрозавдання.