Asynchronous JavaScript. Kirish. Sinxron va Asinxron JavaScript

Assalaamu alaykum.

Allohni izni bilan ushbu "Asynchronous JavaScript" degan maqolalar ketma-ketligini boshlashni niyat qildim.

Bu maqola ushbu ketma-ketlikning birinchisi bo'ladi.

Navbatda Callbacks, Promises, Async/await kabi boshqa maqolalar ham kutib turibdi.

Demak boshladik.

Bismillah.

Bilamiz, JavaScript yozgan kodimizni sinxron tarzda o'qiydi. Misol uchun:

let value = "Some magic value";

value = "yes, it is magical";

console.log(value); // yes, it is magical

Ushbu kodga e'tibor beramiz, kodimizda birinchi qatorda o'zgaruvchi e'lon qildik va qiymat berdik, ikkinchi qatorda o'zgaruvchini qiymatini o'zgartirdik va uchinchi qatorda o'zgaruvchini konsolga chiqardik.

Bu hammasi birhil ketma ketlikda ketyapti.

Birinchi qatordan avval ikkinchi ishlamayapti, ikkinchidan avval uchinchi qator ishlamayapti.

Shuning uchun JavaScript "Single-threaded language" deyiladi. Ya'ni oddiy tilda aytsak, bir vaqtning o'zida yagona ishni bajaradi degani, xuddi tepadagi kodni misol qilganimizdek.

Ho'p yaxshi, demak JavaScript sinxron ishlovchi til ekan, demak har bir qator ketma-ketlikda, biridan keyin biri ishlar ekan.

Unda uzoq vaqtni oladigan kod yozsak nima bo'ladi ?

Misol uchun HTTP so'rovlar, fayl yuklashlar, taymoutlar va hkz.

Demak, agar bu kabi metodlarni ishlatsak va ular 10 sekund vaqt olsa, dasturimizda yozilgan qolgan kodlar 10 sekund kutib turishga majbur bo'lar ekanda ?!

Javob yo'q, yaxshiyamki JavaScript bu kabi "ayrim" jarayonlarni asinxron tarzda olib bora oladi.

P.S: Hamma uzoq vaqtni oladigan kodlarimiz ham asinxron emas, misol uchun for ichida yozilgan kodlarni o'zimiz asinxron qilib ishlatmasak u qolgan kodlarni "blok"lab turadi va qolgan kodlar for tugashini kutib turadi.

"Asinxron ishlash" endi nima bo'ldi ekan ?

Sinxron ishlashning nima ekanligini bildik, ya'ni bir vaqtning o'zida atigi bitta jarayon bajarilishi "sinxron ishlash" bo'lsa,

Asinxron ishlash bir vaqtni o'zida birnechta jarayonlarning bajarilishidir.

Ya'ni ?

Tasavvur qiling bizda quyidagicha kod bor:

let value = "some value";

setTimeout( () => {

  value = "another value";

} ,10000)

value += ", and smth again";

console.log(value); // some value, and smth again

Xo'o'sh🤔, nimadur xato emasmi ?

Axir tepadagi qoida bo'yicha kodlar ketma ket ishlashi kerak, demak bu holatda kodimiz 10 sekund kutib turib keyin valueni "another value" ga tenglashtiradi .

Lekin negadur unday bo'lmadi ? 🤭

Aynan ushbu joyda setTimeout asinxron tarzda ishladi. Ya'ni ushbu setTimeout ichidagi kod 10 sekunddan keyin ishlaydi va qolgan kodimizni 10 sekund kutishga majbur qilmaydi. Shu sabab oxirgi qatordagi kodimiz(console.log) bizga hali o'zgarishga ulgurmagan qiymatni qaytardi.

Boshqa jarayonlarda ham, misol uchun AJAX so'rov yuborsak ham asinxron tarzda ishlaydi.

Demak bir muommodan qutildik, endi bizda boshqa muommolar bor.

Qanday qilib asinxron jarayonni boshqarsak bo'ladi ?

Qanday qilib uzoq vaqtni oladigan ayrim jarayonlarni asinxron kodga o'tkazsak bo'ladi ?

Qanday qilib asinxron jarayonni kutib tursak bo'ladi ?, xuddi "sinxron" koddek.

Qanday qilib asinxron jarayonlarni bir biriga ulash va sinxron jarayon kabi ketma ketlikda ishlatish mumkin ?

Qanday ? 😂

Ushbu savollarga keyingi maqolalarimizda javob olamiz.)

Shuningdek ushbu mavzuni yanada chuqurroq o'rganamiz.)

InshaaAlloh.

Post yoqqan bo'lsa nima qilishni bilasiz. 😉

Ulashing.

Kanalimiz : @JoshDeveloper