Веб-API-деги окуялар циклі (event loop) кантип…

JavaScriptтеги окуялардын цикли (веб-браузердин контекстинде) — бул негизги агымды бөгөбөстөн асинхрондук операцияларды аткарууга мүмкүндүк берген механизм. Ал бир нече компоненттен турат:

Heap (Heap): Объекттер сакталуучу эс тутум аймагы.
Call Stack (Чалуу стек): LIFO алгоритми менен иштеген маалымат структурасы, синхрондук функцияларды көзөмөлдөйт.
Web API (Web APIлер): Браузер тарабынан камсыздалган (DOM, AJAX, setTimeout, setInterval, Event Listeners ж.б.). Алар JavaScript движогунун бөлүгү эмес.
Callback Queue (Калгандар кезеги): Асинхрондук тапшырмаларды аткаруу үчүн билдирүүлөр кезеги.
Microtask Queue (Микро-тапшырмалар кезеги): Приоритеттүү кезек (Promise.then(), async/await, queueMicrotask) жана ал тапшырмалар аткарылат алдында.
Event Loop (Окуялар цикли): Үзгүлтүксүз чалуу стекин жана кезекти текшерет. Эгер стек бош болсо, ал биринчи микро-тапшырманы стекке которот. Микро-тапшырмалар бүтсө, биринчи тапшырманы кезектен стекке которот.

Процесс мындай көрүнөт:

Синхрондук код аткарылат жана функциялар чалуу стекине коюлат.
Асинхрондук операция (мисалы, setTimeout) пайда болгондо, ал тиешелүү Web APIге берилет. Синхрондук код ишин улантат.
Web API операцияны фондук режимде аткарат.
Асинхрондук операция аяктагандан кийин, анын иштеткичи (callback) тапшырмалар кезегине (жалпы async операциялар үчүн) же микро-тапшырмаларга (промисстер үчүн) коюлат.
Окуялар цикли үзгүлтүксүз чалуу стекин жана кезекти текшерет. Эгер стек бош болсо:
- Микро-тапшырмалар кезегин текшерет. Эгер алда иштеткичтер болсо, аларды аткаруу үчүн стекке которот, микро-тапшырмалар бүтсө чейин.
- Андан соң тапшырмалар кезегин текшерет. Эгер алда иштеткичтер болсо, биринчи иштеткичти стекке которот.
Бул процесс кайра-кайра кайталанып, асинхрондук операцияларды негизги агымды бөгөбөстөн аткарууга мүмкүндүк берет.

Мисал менен setTimeout:

// Бул код чалуу стекинде аткарылат
console.log('Start');

// setTimeout - Web API. Callback 0мс өткөндөн кийин тапшырмалар кезегине коюлат.
// Чынжырдын иштеши кечигиши мүмкүн.
setTimeout(() => {
  console.log('Timeout');
}, 0);

// Бул код setTimeoutтөн кийин чалуу стекинде аткарылат
console.log('End');

// Натыйжа:
// Start
// End
// Timeout

Мисал менен промисстер:

// Чалуу стекинде аткарылат
console.log('A');

// promise. then() callback микро-тапшырмалар кезегине коюлат
Promise.resolve().then(() => {
  console.log('B');
});

// Чалуу стекинде аткарылат
console.log('C');

// Натыйжа:
// A
// C
// B

Ишке ашуу тартиби: синхрондук код ('A', 'C'), андан соң микро-тапшырмалар ('B'), андан соң тапшырмалар кезеги.

Веб-API-деги окуялар циклі (event loop) кантип иштейт?