Call stack vs task queue 

JavaScriptda asinxron dasturlash uchun zarur bo'lgan ikkita muhim tushuncha mavjud: Call stack va task queue. Bu ikkalasining qanday ishlashini bilish sizga samarali va xatosiz kod yozishga yordam beradi.

Call stack

Call stack - bu dasturdagi funksiya chaqiruvlarini kuzatish uchun foydalaniladigan ma'lumotlar tuzilmasi. U Last-In-First-Out (LIFO) yondashuvi asosida ishlaydi, ya'ni so'nggi funksiya chaqiruvi stekning yuqori qismiga qo'shiladi va hozirda bajarilayotgan funktsiya har doim yuqorida joylashgan bo'ladi.

Funktsiya chaqirilganda, u stekning yuqori qismiga qo'shiladi. Funksiya bajarilgandan so'ng, u stekdan o'chiriladi. Agar bitta funksiya boshqa funktsiyani chaqirsa, ikkinchi funksiya stekning yuqori qismiga qo'shiladi va birinchi funktsiya ikkinchi funksiya tugashini kutadi.

Task queue

Task queue dastur uchun bajariladigan ishlar ro'yxatiga o'xshaydi. U bajarilishi kerak bo'lgan barcha vazifalarni kuzatib boradi. Birinchi bo'lib birinchi chiqadi (FIFO) asosida ishlaydi, ya'ni navbatga qo'shiladigan birinchi vazifa birinchi bo'lib bajariladi.

Navbatga vazifa qo'shsangiz, u darhol bajarilmaydi. U Call stack bo'sh bo'lguncha kutadi. Call stack to'plami bo'shagach, navbatdagi birinchi vazifa Call stackga ko'chiriladi va keyin bajariladi.

Task queuega vazifalar qo'shishning bir necha yo'li mavjud, masalan:

`setTimeout()`

`setInterval()`

`requestAnimationFrame()`

'Promises'

“Promise” yaratganingizda, u Task queuega qo‘shiladi. "Promise" bajarilganda yoki rad etilgandan so'ng, u tegishli natija bilan yana topshiriqlar navbatiga qo'shiladi. Bu “Promise” hal qilinishini kutish paytida Task queuedagi boshqa funksiyalarni bajarishda davom etish imkonini beradi.

Keling, JavaScript-da “Promises” dan foydalanish misolini ko'rib chiqaylik:

Ushbu misolda biz “Promise” qaytaruvchi “fetchData” funksiyasini yaratamiz. Ushbu funksiya ichida biz 2 soniya davom etadigan asinxron operatsiyani simulyatsiya qilish uchun “setTimeout” dan foydalanamiz.

“FetchData” ni chaqirganimizdan so‘ng, muvaffaqiyatli va xato natijalarni ko‘rib chiqish uchun mos ravishda “.then()” va “.catch()” usullaridan foydalanamiz. `fetchData` chaqirilganda, u Task queuega yangi vazifa qo'shadi. 2 soniya o'tgandan so'ng, "setTimeout" ba'zi soxta ma'lumotlar bilan "Promise" ni muvaffaqiyatli bajaradi. Keyin bajarilgan "Promise" natijasi bilan yana Task queuega qo'shiladi. Bu `.then()` usulining bajarilishini ishga tushiradi va `{ name: 'John', age: 42 }`ni ko'rsatadi.

Xulosa

Call stack va Task queue hamkorlikda ishlaydi, bu JavaScriptni asinxron tarzda ishlashiga imkon beradi. Funksiyani chaqirganingizda, u Call stackga qo'shiladi. Ammo agar funktsiya `setTimeout()` yoki `Promise` kabi asinxron operatsiyaga ega bo`lsa, u darhol bajarilmaydi. Buning o'rniga, async operatsiyasi Task queuega o'tadi.

Call stack bo'sh bo'lsa, navbatdagi birinchi vazifa Call stackga o'tadi va ishlaydi. Bu Task queue boʻshaguncha davom etadi.

Agar sizda Call stackni bloklaydigan kattaroq funksiya mavjud bo'lsa, u boshqa funktsiyalarni, hatto ular Task queueda bo'lsa ham, ularning ishlashini to'xtatishi mumkin. Buni tuzatish uchun kattaroq funktsiyani kichikroq qismlarga bo'lib qo'ying yoki asinxron operatsiyalardan foydalaning.