Чӣ тавр гардиши ҳодиса (event loop) дар API-и веб кор мекунад?

Цикли воқеаҳо дар JavaScript (дар контексти браузери веб) механизмиест, ки имкон медиҳад, ки амалиётҳои асинхронӣ бидуни бастани ҷараёни асосӣ иҷро шаванд. Он аз чанд компонент иборат аст:

• Heap (Ҳеоп): Минтақаи хотира, ки дар он объектҳо нигоҳ дошта мешаванд.
• Call Stack (Занҷири занҷир): Сохтори додаҳо бо алгоритми LIFO, ки иҷрои функсияҳои синхронӣро пайгирӣ мекунад.
• Web API (API-ҳои веб): Тавассути браузер пешниҳод мешаванд (DOM, AJAX, setTimeout, setInterval, Event Listeners ва ғайра). Онҳо қисми муҳаррики JavaScript нестанд.
• Callback Queue (Занҷири бозгашт): Занҷири паёмҳо барои иҷрои вазифаҳои асинхронӣ.
• Microtask Queue (Занҷири микрофунксияҳо): Занҷири афзалиятнок барои микрофунксияҳо (Promise.then(), async/await, queueMicrotask). Он пеш аз занҷири вазифаҳо иҷро мешавад.
• Event Loop (Лавҳаи воқеа): Беистоде пайваста санҷиш мекунад занҷирҳои занҷир ва вазифаҳо. Агар занҷир холӣ бошад, аввалин коркардро аз занҷири микрофунксияҳо ба занҷир мегузаронад. Пас аз холӣ шудани занҷири микрофунксияҳо, аввалин коркардро аз занҷири вазифаҳо ба занҷир мегузаронад.

Процесси чунин аст:

1. Кодекси синхронӣ иҷро мешавад ва функсияҳо ба занҷир ҷойгир мешаванд.
2. Вақте ки амалиёти асинхронӣ (масалан, setTimeout) пайдо мешавад, он ба Web API мувофиқ дода мешавад. Кодекси синхронӣ идома меёбад.
3. Web API амалиётро дар пасзамана иҷро мекунад.
4. Пас аз анҷоми амалиёти асинхронӣ, коркард (callback) ба занҷири вазифаҳо (барои амалиётҳои оддӣ) ё ба микрозанҷир (барои promises) ҷойгир мешавад.
5. Лавҳаи воқеа пайваста занҷирҳоро санҷида, агар холӣ бошанд, аввалин коркардро аз занҷири микрофунксияҳо ба занҷир мегузаронад. Пас аз холӣ шудани микрофунксияҳо, аввалин коркардро аз занҷири вазифаҳо мегузаронад.
6. Ин раванд такрор мешавад, ва имкон медиҳад, ки амалиётҳои асинхронӣ бидуни бастани ҷараёни асосӣ иҷро шаванд.

Масалан бо setTimeout:

// Ин код дар занҷири занҷирҳо иҷро мешавад
console.log('Start');

// setTimeout - Web API. Callback дар занҷири вазифаҳо пас аз 0мс ҷойгир мешавад.
// Иҷрои воқеӣ метавонад бо сабаби цикли воқеаҳо дер шавад.
setTimeout(() => {
  console.log('Timeout');
}, 0);

// Ин код пас аз setTimeout дар занҷири занҷирҳо иҷро мешавад
console.log('End');

// Натиҷа:
// Start
// End
// Timeout

Масалан бо promises:

// дар занҷири занҷирҳо иҷро мешавад
console.log('A');

// callback-и then() дар микрозанҷир ҷойгир мешавад
Promise.resolve().then(() => {
  console.log('B');
});

// дар занҷири занҷирҳо иҷро мешавад
console.log('C');

// Натиҷа:
// A
// C
// B

Тартиби иҷроиш: код синхронӣ ('A', 'C'), пас микрозанҷир холӣ мешавад ('B'), сипас занҷири вазифаҳо.