JavaScript async va await

Promise zanjiri callback’dan yaxshi, lekin baribir then ichida yoziladi. async/await esa asinxron kodni oddiy ketma-ket kod kabi yozishga imkon beradi.

then va await — bir xil ish

JavaScript

function kechikish(qiymat, ms) {
return new Promise((bajar) => setTimeout(() => bajar(qiymat), ms));
}

kechikish("then bilan", 300).then((n) => console.log(n));

async function boshla() {
const n = await kechikish("await bilan", 300);
console.log(n);
}

boshla();

await Promise oldiga qo’yiladi va uning natijasini beradi — then callback’i shart emas.

async funksiya Promise qaytaradi

JavaScript

async function qiymat() {
return 42;
}

console.log(qiymat());

qiymat().then((n) => console.log("then orqali:", n));

async function ol() {
console.log("await orqali:", await qiymat());
}
ol();

return 42 yozilsa ham, tashqaridan qaralganda Promise chiqadi — async qiymatni avtomatik o’raydi.

Zanjir o’rniga ketma-ket kod

Oldingi darsdagi uch qadamli zanjirni solishtiring:

JavaScript

function kechikish(qiymat, ms) {
return new Promise((bajar) => setTimeout(() => bajar(qiymat), ms));
}

async function jarayon() {
const a = await kechikish(5, 200);
console.log("1-qadam:", a);

const b = a * 2;
console.log("2-qadam:", b);

const c = await kechikish(b + 1, 200);
console.log("3-qadam:", c);

return c;
}

jarayon().then((n) => console.log("Yakun:", n));

then yo’q, ichma-ich qavs yo’q — kod yuqoridan pastga o’qiladi. Aynan shu sabab async/await bugungi standart usul.

Xatoni try/catch bilan ushlash

await bilan try/catch to’g’ridan-to’g’ri ishlaydi:

JavaScript

function bolish(a, b) {
return new Promise((bajar, rad) => {
  if (b === 0) rad(new Error("Nolga bo'lib bo'lmaydi"));
  else bajar(a / b);
});
}

async function hisobla() {
try {
  console.log(await bolish(10, 2));
  console.log(await bolish(10, 0));
  console.log("Bu qator bajarilmaydi");
} catch (xato) {
  console.log("Xato:", xato.message);
} finally {
  console.log("Yakunlandi");
}
}

hisobla();

Rad etilgan Promise await da xatoga aylanadi — sinxron koddagi bilan bir xil tarzda ushlanadi.

Parallel bajarish — muhim nuqta

Ketma-ket await — ketma-ket kutish demak:

JavaScript

function kechikish(qiymat, ms) {
return new Promise((bajar) => setTimeout(() => bajar(qiymat), ms));
}

async function sekin() {
const boshi = Date.now();

const a = await kechikish("A", 300);
const b = await kechikish("B", 300);
const c = await kechikish("C", 300);

console.log(a, b, c);
console.log("Vaqt:", Date.now() - boshi, "ms");
}

sekin();

~900 ms ketdi. Bu uchta amal bir-biriga bog’liq bo’lmasa — isrof.

Promise.all bilan parallel:

JavaScript

function kechikish(qiymat, ms) {
return new Promise((bajar) => setTimeout(() => bajar(qiymat), ms));
}

async function tez() {
const boshi = Date.now();

const [a, b, c] = await Promise.all([
  kechikish("A", 300),
  kechikish("B", 300),
  kechikish("C", 300),
]);

console.log(a, b, c);
console.log("Vaqt:", Date.now() - boshi, "ms");
}

tez();

~300 ms — uch barobar tez. Natijani destructuring bilan ajratib olindi.

Siklda await

JavaScript

function kechikish(qiymat, ms) {
return new Promise((bajar) => setTimeout(() => bajar(qiymat), ms));
}

async function royxat() {
const nomlar = ["A", "B", "C"];

for (const nom of nomlar) {
  const n = await kechikish(nom, 200);
  console.log("Keldi:", n);
}

console.log("Hammasi tugadi");
}

royxat();

for...of bilan await kutiladi. Ammo forEach bilan ishlamaydi:

JavaScript

function kechikish(qiymat, ms) {
return new Promise((bajar) => setTimeout(() => bajar(qiymat), ms));
}

async function xato() {
["A", "B"].forEach(async (nom) => {
  const n = await kechikish(nom, 200);
  console.log("Keldi:", n);
});

console.log("Bu birinchi chiqadi — kutilmadi!");
}

xato();

forEach callback’ning Promise’ini kutmaydi. Kutish kerak bo’lsa — for...of, parallel kerak bo’lsa — map + Promise.all.

Amaliy mashq

1 soniya kutib matn qaytaradigan async funksiya yozing;
uni await bilan chaqirib, natijani chiqaring;
rad etiladigan Promise’ni try/catch bilan ushlang;
uchta kechikishni ketma-ket, so’ng Promise.all bilan bajarib, vaqtni solishtiring;
for...of ichida await ishlating;
shu siklni forEach ga almashtirib, tartib buzilishini ko’ring.

4- va 6-qadamlar async/await dagi ikki asosiy tuzoqni ko’rsatadi.

Qisqacha xulosa

async funksiya har doim Promise qaytaradi.
await Promise natijasini kutadi va qiymatini beradi.
Rad etilgan Promise await da xatoga aylanadi — try/catch ushlaydi.
Ketma-ket await vaqtni qo’shadi; bog’liq bo’lmagan amallar uchun Promise.all ishlating.
for...of await ni kutadi, forEach — yo’q.

Keyingi darsda fetch — serverdan haqiqiy ma’lumot olish.