IlmHamroh
JavaScript Full-stack/8-qism. JavaScript asoslari58/61-dars16 daqiqa
Mundarija (32)

JavaScript massiv destructuring: elementlarni o'rni bo'yicha ajratish

Qisqacha: Massiv destructuring — massiv elementlarini o'rni bo'yicha o'zgaruvchilarga ajratish: const [birinchi, ikkinchi] = royxat;. Obyektdan farqi — bu yerda nom emas, tartib muhim: birinchi o'zgaruvchi 0-elementni, ikkinchisi 1-elementni oladi. Keraksiz elementni vergul bilan o'tkazib yuborasiz, qolganini ...qolgan bilan yig'asiz. Ikki o'zgaruvchining qiymatini [a, b] = [b, a]; bilan almashtirish mumkin.

Bu darsda

  • const [a, b] = massiv bilan elementlarni o'zgaruvchilarga ajrata olasiz.
  • Keraksiz elementlarni o'tkazib yuborasiz, default qiymat qo'yasiz, qolganini ... bilan yig'asiz.
  • Ikki o'zgaruvchining qiymatini bitta qatorda almashtira olasiz va bu yerdagi ASI tuzog'ini bilasiz.
  • Object.entries va for...of ni destructuring bilan birga ishlatasiz.
  • is not iterable xatosini tushunib, tuzata olasiz.

Oldin bilishingiz kerak: Obyekt destructuring, Massiv: yaratish va elementga murojaat, Kesish, birlashtirish va matnga aylantirish, Obyekt bo'ylab yurish.

1. Nega bu kerak?

Oldingi darsda obyektdan qiymatlarni nomi bilan ajratib oldik. Endi massivga qaraymiz.

Foydalanuvchi ro'yxatdan o'tishda to'liq ismini bitta maydonga yozdi: "Malika Karimova". Sizga ism va familiya alohida kerak. Satrni bo'lish ni bilasiz:

js
const toliqIsm = "Malika Karimova";
const qismlar = toliqIsm.split(" ");

const ism = qismlar[0];
const familiya = qismlar[1];

console.log(ism); // Malika
console.log(familiya); // Karimova

Ishlaydi. Lekin qismlar[0] va qismlar[1] — "sehrli raqamlar". Kodni o'qigan odam bir soniya to'xtab, "0 — bu nima edi?" deb o'ylaydi. Ikkita element uchun ikki qator, beshta element uchun besh qator yozasiz.

Xuddi shu ishni massiv destructuring bitta qatorda qiladi — va har bir qiymatga darhol ma'noli nom beradi.

2. Asosiy sintaksis

2.1 Birinchi misol

js
const toliqIsm = "Malika Karimova";

const [ism, familiya] = toliqIsm.split(" ");
console.log(ism); // Malika
console.log(familiya); // Karimova

Obyekt destructuringdan bitta farq bor: jingalak qavs { } o'rniga kvadrat qavs [ ]. Chap tomondagi [ism, familiya] — massiv emas, qolip: "birinchi elementni ism ga, ikkinchisini familiya ga yoz".

Hayotdan o'xshatish: poyezd vagonlari. Siz nomini bilmaysiz, faqat tartibini bilasiz: "birinchi vagon — Ali uchun, ikkinchisi — Vali uchun". Kim qaysi vagonga tushishi faqat o'rniga bog'liq.

2.2 Tartib muhim, nom erkin

Obyektda o'zgaruvchi nomi kalit nomi bilan bir xil bo'lishi shart edi. Massivda kalit nomi yo'q — faqat indeks bor. Shuning uchun nomni o'zingiz xohlagancha tanlaysiz, faqat tartibni to'g'ri yozasiz:

js
const koordinata = [41.31, 69.28];

const [kenglik, uzunlik] = koordinata;
console.log(kenglik); // 41.31
console.log(uzunlik); // 69.28

Tartibni almashtirsangiz, qiymatlar ham almashadi:

js
const koordinata = [41.31, 69.28];

const [uzunlik, kenglik] = koordinata; // ❌ tartib adashdi
console.log(uzunlik); // 41.31

JavaScript xato bermaydi — u nomning ma'nosini bilmaydi. U shunchaki birinchi o'zgaruvchiga 0-elementni yozdi. Shuning uchun massiv destructuringda tartibni diqqat bilan tekshiring.

Obyekt destructuring Massiv destructuring
Qavs { } [ ]
Nima bo'yicha oladi Kalit nomi O'rni (indeks)
O'zgaruvchi nomi Kalit bilan bir xil Istalgan
Tartib Ahamiyatsiz Juda muhim

2.3 Element kam yoki ko'p bo'lsa

O'zgaruvchi massiv elementlaridan kam bo'lsa — ortiqcha elementlar shunchaki olinmaydi:

js
const gollar = [3, 1, 2, 0];

const [birinchiOyin] = gollar;
console.log(birinchiOyin); // 3

O'zgaruvchi elementlardan ko'p bo'lsa — yetmaganlariga undefined yoziladi. Xuddi massivda yo'q indeksni o'qigandagidek (gollar[10]):

js
const ranglar = ["qizil", "yashil"];

const [a, b, c] = ranglar;
console.log(a); // qizil
console.log(b); // yashil
console.log(c); // undefined

2.4 Satrni ham ajratish mumkin

Massiv destructuring faqat massiv bilan emas, har qanday iterable bilan ishlaydi. for...of darsida ko'rgandingiz: iterable — ichidagi qiymatlarni birma-bir bera oladigan narsa. Satr ham iterable:

js
const [birinchiHarf, ikkinchiHarf] = "Toshkent";
console.log(birinchiHarf); // T
console.log(ikkinchiHarf); // o

Satr harflarga bo'linib, birinchi ikkitasi olindi. Kundalik ishda bunga kam duch kelasiz, lekin qoidani tushunish muhim: [ ] qolip — "birma-bir beradigan narsa"dan tartib bilan olish.

Tekshirib ko'ring: Konsolda nima chiqadi?

js
const [x, y] = [10, 20, 30];
console.log(y);
Javob

20. x 0-elementni (10), y 1-elementni (20) oldi. 30 hech qaysi o'zgaruvchiga tushmadi — u shunchaki e'tiborsiz qoldi.

Tekshirib ko'ring: const [ism, yosh] = ["Jasur"]; dan keyin yosh nimaga teng? Xato chiqadimi?

Javob

yosh — undefined, xato chiqmaydi. Massivda faqat bitta element bor. Ikkinchi o'zgaruvchi 1-indeksni oladi, u yerda esa hech narsa yo'q.

3. Elementni o'tkazib yuborish

Ba'zan faqat ikkinchi yoki uchinchi element kerak bo'ladi. Keraksiz element o'rnini bo'sh qoldirib, faqat vergul qo'yasiz:

js
const podium = ["Ali", "Vali", "Guli"];

const [, kumush] = podium;
console.log(kumush); // Vali

[, kumush] — "birinchi o'rinni o'tkazib yubor, ikkinchisini kumush ga yoz". Vergul oldidagi bo'sh joy — "bu elementni olmayman" degani.

O'rtadagini ham tashlab ketish mumkin:

js
const podium = ["Ali", "Vali", "Guli"];

const [oltin, , bronza] = podium;
console.log(oltin); // Ali
console.log(bronza); // Guli

Ikki vergul orasida bo'sh joy — "ikkinchi element kerak emas".

Diqqat: Ketma-ket ko'p vergul ([, , , , beshinchi]) o'qishni qiyinlashtiradi — vergullarni sanab o'tirish kerak. Bunday holda oddiy indeks tushunarliroq: const beshinchi = royxat[4];. Destructuring — qulaylik uchun, majburiyat emas.

Tekshirib ko'ring: const [, , uchinchi] = ["a", "b", "c", "d"]; dan keyin uchinchi nimaga teng?

Javob

"c". Ikkita vergul ikkita elementni ("a" va "b") o'tkazib yubordi. Uchinchi o'rin — 2-indeks — "c".

4. Default qiymat

Obyektdagidek, massivda ham = bilan default qiymat beriladi. U element yo'q (yoki undefined) bo'lganda ishlaydi:

js
const sozlama = "qorong'i".split(",");

const [mavzu, til = "uz"] = sozlama;
console.log(mavzu); // qorong'i
console.log(til); // uz

split bitta elementli massiv qaytardi — ["qorong'i"]. Ikkinchi element yo'q, shuning uchun til default qiymatni oldi.

Qoida obyektdagi bilan bir xil: default faqat undefined da ishlaydi. null da ishlamaydi:

js
const [x = 1, y = 2] = [undefined, null];
console.log(x); // 1
console.log(y); // null

x ning o'rnida undefined — default 1 ishladi. y ning o'rnida null — bu qiymat deb hisoblanadi, default ishlamadi.

5. Qolganini yig'ish: ...qolgan

5.1 Rest element

Obyekt destructuringdagi ...qolgan massivda ham bor. U nomi aytilmagan barcha elementlarni yangi massivga yig'adi:

js
const navbat = ["Aziz", "Bekzod", "Charos", "Dilnoza"];

const [hozirgi, ...kutayotganlar] = navbat;
console.log(hozirgi); // Aziz
console.log(kutayotganlar); // [ 'Bekzod', 'Charos', 'Dilnoza' ]

Klinikadagi navbatni tasavvur qiling: birinchi odam shifokor xonasiga kiradi, qolganlar esa "kutayotganlar" ro'yxatida qoladi.

kutayotganlar — haqiqiy massiv. Unga length, join va boshqa massiv metodlarini qo'llash mumkin. Asl navbat massivi esa o'zgarmaydi.

Yig'adigan element qolmasa, rest bo'sh massiv bo'ladi — undefined emas:

js
const [yagona, ...boshqalar] = ["Aziz"];
console.log(yagona); // Aziz
console.log(boshqalar); // []

5.2 Rest — faqat oxirida

Obyektdagi kabi, rest faqat qolipning oxirida bo'la oladi:

js
const [birinchi, ...ortasi, oxirgi] = [1, 2, 3, 4];
text
SyntaxError: Rest element must be last element

"Rest element oxirgi bo'lishi shart". Oxirgi elementni olish kerak bo'lsa, destructuring emas, at(-1) ishlating: royxat.at(-1).

Tekshirib ko'ring: const [, ...qolgan] = [5, 10, 15]; dan keyin qolgan nimaga teng?

Javob

[10, 15]. Birinchi element (5) vergul bilan o'tkazib yuborildi. Rest esa qolgan hammasini — 10 va 15 ni — yangi massivga yig'di. Bu [5, 10, 15].slice(1) bilan bir xil natija.

6. Ikki o'zgaruvchini almashtirish (swap)

6.1 Eski usul: uchinchi "stakan"

Ikki o'zgaruvchining qiymatini almashtirish — dasturlashdagi klassik vazifa. Masalan, ikki smena almashdi:

js
let kunduzgi = "Rustam";
let kechki = "Sardor";

const vaqtincha = kunduzgi;
kunduzgi = kechki;
kechki = vaqtincha;

console.log(kunduzgi, kechki); // Sardor Rustam

Nega uchinchi o'zgaruvchi kerak? Ikki stakanni tasavvur qiling: birida choy, birida sut. Ularni almashtirish uchun bo'sh uchinchi stakan kerak. Aks holda kunduzgi = kechki; qatoridan keyin "Rustam" yo'qolib ketadi.

6.2 Destructuring bilan — bitta qatorda

js
let kunduzgi = "Rustam";
let kechki = "Sardor";

[kunduzgi, kechki] = [kechki, kunduzgi];

console.log(kunduzgi, kechki); // Sardor Rustam

Bu qator qanday ishlaydi? JavaScript avval o'ng tomonni to'liq hisoblaydi: [kechki, kunduzgi] → ["Sardor", "Rustam"]. Bu yangi massiv, eski qiymatlar uning ichida xavfsiz saqlandi. Keyin chap tomondagi qolip bu massivni ajratadi: kunduzgi ga "Sardor", kechki ga "Rustam".

Ya'ni o'ng tomondagi massiv — o'sha "uchinchi stakan". Faqat uni JavaScript o'zi yaratadi va o'zi tashlab yuboradi.

E'tibor bering:

  • Bu yerda const yoki let yo'q — o'zgaruvchilar allaqachon mavjud, biz faqat yangi qiymat beryapmiz.
  • Shuning uchun ular let bilan e'lon qilingan bo'lishi kerak. const ni qayta tayinlab bo'lmaydi.
  • Obyektdagidan farqli, bu yerda qavsga olish shart emas. Qator [ bilan boshlanadi, { bilan emas — JavaScript uni blok deb o'ylamaydi.

Xuddi shu usul bilan massiv ichidagi ikki elementni ham almashtirish mumkin. Bu keyinchalik saralash algoritmlarida ko'p kerak bo'ladi:

js
const orinlar = ["Ali", "Vali", "Guli"];

[orinlar[0], orinlar[2]] = [orinlar[2], orinlar[0]];
console.log(orinlar); // [ 'Guli', 'Vali', 'Ali' ]

6.3 ASI tuzog'i: [ bilan boshlanadigan qator

Swap qatori [ bilan boshlanadi. Sintaksis asoslari darsida ogohlantirgandik: bunday qatordan oldin nuqta-vergul bo'lmasa, JavaScript ikki qatorni bitta deb o'qiydi. Keling, shuni real ko'ramiz:

js
let chap = "Ali";
let ong = "Vali";
console.log("Almashtiramiz...")
[chap, ong] = [ong, chap];

Konsolda avval Almashtiramiz... chiqadi, keyin qizil xato:

text
TypeError: Cannot set properties of undefined (setting 'Vali')

Tarjimasi: "undefined ning xususiyatini o'rnatib bo'lmaydi ('Vali' ni o'rnatayotganda)". Bu xabar juda g'alati tuyuladi — biz hech qanday xususiyat o'rnatmoqchi emasdik-ku! Keling, sekin ko'ramiz.

Uchinchi qator oxirida ; yo'q. To'rtinchi qator [ bilan boshlanadi — bu oldingi qatorning davomi bo'la oladi. Shuning uchun JavaScript ikkalasini bitta qilib o'qidi:

js
console.log("Almashtiramiz...")[chap, ong] = [ong, chap];

Endi [chap, ong] swap emas, balki console.log(...) natijasidan indeks bilan xususiyat olish bo'lib qoldi. Qavs ichida esa vergul operatori ishladi: u oxirgi qiymatni — ong, ya'ni "Vali" ni beradi. console.log esa undefined qaytaradi. Natijada JavaScript undefined["Vali"] = ... ni bajarishga urindi va yiqildi.

Xabar ko'rsatgan joy ('Vali') aybdor emas. Xato bir qator yuqorida — yetishmayotgan nuqta-vergulda.

Tuzatish: oldingi qator oxiriga ; qo'ying:

js
let chap = "Ali";
let ong = "Vali";
console.log("Almashtiramiz...");
[chap, ong] = [ong, chap];
console.log(chap, ong);

Konsolda:

text
Almashtiramiz...
Vali Ali

Diqqat: Oldingi qator let ong = "Vali" (nuqta-vergulsiz) bo'lsa, boshqa xato chiqadi: ReferenceError: Cannot access 'ong' before initialization. Sabab o'sha: JavaScript "Vali"[chap, ong] deb o'qidi va ong ni hali yaratilmasdan ishlatmoqchi bo'ldi. Xato matni har xil, ildizi bitta — [ bilan boshlangan qator oldida ; yo'q.

Tekshirib ko'ring: let a = 5; let b = 8; — qanday qilib bitta qatorda a ni 8 ga, b ni 5 ga aylantirasiz?

Javob

[a, b] = [b, a];. O'ng tomon avval [8, 5] massiviga aylanadi, keyin chap tomon uni ajratadi. Oldingi qatorda ; borligiga ishonch hosil qiling.

7. Funksiyadan bir nechta qiymat qaytarish

return darsida aytgandik: bir nechta qiymatni massiv yoki obyektga solib qaytarish mumkin. Massiv bilan qaytarilgan natija destructuring bilan qulay ochiladi:

js
function pulniBol(summa, odamlar) {
  const harKimga = Math.floor(summa / odamlar);
  const ortgan = summa % odamlar;
  return [harKimga, ortgan];
}

const [ulush, qoldiq] = pulniBol(100000, 3);
console.log(ulush); // 33333
console.log(qoldiq); // 1

Uch do'st 100 000 so'mni teng bo'lmoqchi. Funksiya ikki qiymat qaytaradi: har kimga tegadigan ulush va ortib qolgan qism. Math.floor sonni pastga yaxlitlaydi, % esa bo'linishdan qolgan qoldiqni beradi.

Qachon massiv, qachon obyekt qaytarish kerak?

Massiv [a, b] Obyekt { a, b }
2 ta qiymat, tartibi aniq 3 ta va undan ko'p qiymat
Chaqiruvchi nomni o'zi tanlaydi Nomlar funksiyada belgilangan
Tartibni adashtirish xavfi bor Tartib ahamiyatsiz

Masalan, "ulush va qoldiq" — tabiiy juftlik, massiv yaxshi. Foydalanuvchi ma'lumoti (ism, yosh, shahar, telefon) — obyekt yaxshiroq.

Maslahat: Kursning React qismida const [son, setSon] = useState(0); kabi qatorni ko'p ko'rasiz. Bu aynan massiv destructuring: funksiya ikki elementli massiv qaytaradi, siz ularga o'zingiz nom berasiz. Hozir React'ni bilish shart emas — sintaksis tanish bo'lsa yetarli.

8. for...of ichida destructuring

8.1 Object.entries bilan

Obyekt bo'ylab yurish darsida Object.entries ni ko'rgandingiz. U obyektni juftliklar massiviga aylantiradi:

js
const narxlar = { non: 4000, sut: 12000, tuxum: 18000 };

console.log(Object.entries(narxlar));

Konsolda:

text
[ [ 'non', 4000 ], [ 'sut', 12000 ], [ 'tuxum', 18000 ] ]

Har bir juftlik — ikki elementli massiv: [kalit, qiymat]. Destructuringsiz uni shunday aylanardik:

js
const narxlar = { non: 4000, sut: 12000 };

for (const juft of Object.entries(narxlar)) {
  console.log(`${juft[0]}: ${juft[1]} so'm`);
}

Konsolda:

text
non: 4000 so'm
sut: 12000 so'm

juft[0] va juft[1] — yana o'sha "sehrli raqamlar". Endi destructuring bilan:

js
const narxlar = { non: 4000, sut: 12000, tuxum: 18000 };

for (const [mahsulot, narx] of Object.entries(narxlar)) {
  console.log(`${mahsulot}: ${narx} so'm`);
}

Konsolda:

text
non: 4000 so'm
sut: 12000 so'm
tuxum: 18000 so'm

Bu yozuvni o'sha darsda oldindan ko'rib qo'ygan edik — endi u qanday ishlashini bilasiz. for (const [mahsulot, narx] of ...) — har aylanishda navbatdagi juftlik darhol ikki o'zgaruvchiga ajratiladi. Sikl ichida ma'noli nomlar bilan ishlaysiz. Bu naqsh real kodda juda ko'p uchraydi — uni yodlab oling.

8.2 Massivning entries() metodi bilan

Massivda indeks ham, qiymat ham kerak bo'lsa, massivning entries() metodi [indeks, element] juftliklarini beradi:

js
const hujumchilar = ["Shomurodov", "Masharipov", "Fayzullayev"];

for (const [i, futbolchi] of hujumchilar.entries()) {
  console.log(`${i + 1}. ${futbolchi}`);
}

Konsolda:

text
1. Shomurodov
2. Masharipov
3. Fayzullayev

Indeks 0 dan boshlanadi, shuning uchun chiqarishda i + 1 yozdik.

8.3 Aralash: obyekt ichida massiv, massiv ichida massiv

Qoliplarni bir-biriga joylash mumkin. Obyekt ichidagi massivdan birinchi elementni olamiz:

js
const talaba = { ism: "Jasur", baholar: [5, 4, 5] };

const { ism, baholar: [birinchiBaho] } = talaba;
console.log(ism, birinchiBaho); // Jasur 5

baholar: [birinchiBaho] — "baholar kalitiga kir, u massiv — undan birinchi elementni ol". Obyekt destructuringdagi ichma-ich qolip bilan bir xil g'oya.

Tekshirib ko'ring: for (const [k, v] of Object.entries({ a: 1 })) siklida k va v nimaga teng?

Javob

k — "a", v — 1. Object.entries({ a: 1 }) → [["a", 1]]. Sikl bitta marta aylanadi va ["a", 1] juftligini k va v ga ajratadi.

9. Ko'p uchraydigan xatolar

9.1 undefined yoki obyektni massiv kabi ajratish

js
function narxlarniOl() {
  // hech narsa qaytarmadi
}

const [birinchi] = narxlarniOl();
text
TypeError: narxlarniOl is not a function or its return value is not iterable

Tarjimasi: "narxlarniOl — funksiya emas yoki uning natijasi iterable emas". JavaScript ikki ehtimolni birga aytyapti. Bizda funksiya bor, demak ikkinchisi: u undefined qaytardi, undefined esa iterable emas.

O'zgaruvchi bilan bo'lsa, xabar qisqaroq:

js
const talaba = { ism: "Ali", yosh: 19 };

const [ism, yosh] = talaba;
text
TypeError: talaba is not iterable

Oddiy obyekt iterable emas — unda "birinchi element", "ikkinchi element" degan tartib yo'q. Obyektni ajratish uchun { } qolip kerak: const { ism, yosh } = talaba;. Qoidani eslang: obyektga — { }, massivga — [ ].

Tuzatish (qiymat yo'q bo'lishi mumkin bo'lsa): ?? [] bilan bo'sh massivga almashtiring.

js
const javob = undefined;

const [birinchi = "yo'q"] = javob ?? [];
console.log(birinchi); // yo'q

9.2 Tartibni adashtirish

const [familiya, ism] = "Malika Karimova".split(" "); — xato chiqmaydi, lekin familiya ga "Malika" tushadi. Massiv destructuringda nom hech narsani hal qilmaydi — faqat o'rin. Natijani bir marta console.log bilan tekshirib ko'ring.

9.3 Swap'dan oldin nuqta-vergul yo'q

TypeError: Cannot set properties of undefined yoki ReferenceError: Cannot access ... before initialization — [ bilan boshlangan qator oldida ; unutilganda chiqadi. Tuzatish — oldingi qator oxiriga ;.

9.4 const o'zgaruvchini almashtirish

js
const a = 1;
const b = 2;

[a, b] = [b, a];
text
TypeError: Assignment to constant variable.

"Doimiy o'zgaruvchiga qiymat berish". Swap o'zgaruvchilarga yangi qiymat yozadi, const esa bunga ruxsat bermaydi. Almashtiriladigan o'zgaruvchilarni let bilan e'lon qiling.

10. Mashqlar

1-mashq (oson): Sana bo'laklari

"27.09.2026" satrini split(".") bilan bo'ling va destructuring bilan kun, oy, yil o'zgaruvchilariga ajrating. Natija: Yil: 2026, oy: 09, kun: 27.

Yechim
js
const sana = "27.09.2026";

const [kun, oy, yil] = sana.split(".");
console.log(`Yil: ${yil}, oy: ${oy}, kun: ${kun}`);
// Yil: 2026, oy: 09, kun: 27

split(".") → ["27", "09", "2026"]. Tartib bo'yicha: birinchisi kun, ikkinchisi oy, uchinchisi yil. E'tibor bering: ular satr, son emas. Son kerak bo'lsa, Number(yil) qiling.

2-mashq (o'rta): Musobaqa natijalari

Quyidagi massivdan destructuring bilan:

  • birinchi o'rinni golib nomli o'zgaruvchiga;
  • ikkinchi o'rinni o'tkazib yuborib;
  • qolganlarini qolganlar massiviga oling.

Keyin G'olib: Madina va Qolganlar soni: 3 ni chiqaring.

js
const natijalar = ["Madina", "Otabek", "Sevara", "Nodir", "Kamola"];
Yechim
js
const natijalar = ["Madina", "Otabek", "Sevara", "Nodir", "Kamola"];

const [golib, , ...qolganlar] = natijalar;
console.log(`G'olib: ${golib}`);
console.log(`Qolganlar soni: ${qolganlar.length}`);

Konsolda:

text
G'olib: Madina
Qolganlar soni: 3

golib — 0-element. Bo'sh joy va vergul "Otabek"ni o'tkazib yubordi. Rest qolgan uchtasini (Sevara, Nodir, Kamola) yangi massivga yig'di.

3-mashq (qiyin): Oylik hisobot

Obyektda har bir oyning daromadi bor. for...of, Object.entries va destructuring bilan har oyni chiqaring. Oxirida eng katta daromadli oyni ham chiqaring.

js
const daromad = { yanvar: 4200000, fevral: 5100000, mart: 3900000 };

Kutilgan natija:

text
yanvar: 4200000 so'm
fevral: 5100000 so'm
mart: 3900000 so'm
Eng yaxshi oy: fevral

Ishora: sikldan oldin let engYaxshiOy = ""; va let engKatta = 0; e'lon qiling. Sikl ichida joriy summa engKatta dan katta bo'lsa — ikkalasini yangilang.

Yechim
js
const daromad = { yanvar: 4200000, fevral: 5100000, mart: 3900000 };

let engYaxshiOy = "";
let engKatta = 0;

for (const [oy, summa] of Object.entries(daromad)) {
  console.log(`${oy}: ${summa} so'm`);
  if (summa > engKatta) {
    engKatta = summa;
    engYaxshiOy = oy;
  }
}

console.log(`Eng yaxshi oy: ${engYaxshiOy}`);

Konsolda:

text
yanvar: 4200000 so'm
fevral: 5100000 so'm
mart: 3900000 so'm
Eng yaxshi oy: fevral

Object.entries har bir oyni [oy, summa] juftligiga aylantirdi. Destructuring esa juftlikni darhol ikkita ma'noli nomga ajratdi. juft[0] va juft[1] bilan yozilgan kodga solishtiring — bu variant ancha tushunarli.

11. Real ishda

  • Matnni bo'laklash. Sana, vaqt, to'liq ism, koordinata — split va massiv destructuring juftligi har kuni ishlatiladi: const [soat, daqiqa] = "14:30".split(":");.
  • Obyekt bo'ylab yurish. for (const [kalit, qiymat] of Object.entries(obj)) — JavaScript dasturchisining eng ko'p yozadigan qatorlaridan biri.
  • React. const [holat, setHolat] = useState(...) — React'dagi eng mashhur qator. Buni kursda alohida o'rganamiz.
  • Algoritmlar. Saralash va massivni teskari aylantirishda elementlarni almashtirish kerak. [m[i], m[j]] = [m[j], m[i]] — intervyuda tez-tez yoziladigan qator.

Intervyuda "vaqtincha o'zgaruvchisiz ikki qiymatni qanday almashtirasiz?" deb so'rashadi. Javob: [a, b] = [b, a]; va "oldingi qatorda nuqta-vergul bo'lishi kerak" degan izoh — bu sizni boshqalardan ajratib turadi.

Xulosa

  • const [a, b] = massiv; — elementlarni o'rni bo'yicha ajratadi. Nom erkin, tartib muhim.
  • Yetishmagan element — undefined, ortiqcha element — e'tiborsiz qoladi.
  • [, b] — o'tkazib yuborish, [a = 1] — default (faqat undefined da), [a, ...qolgan] — qolganini yangi massivga yig'ish (faqat oxirida).
  • [a, b] = [b, a]; — swap. Oldingi qatorda ; bo'lishi shart.
  • for (const [kalit, qiymat] of Object.entries(obj)) — obyekt bo'ylab yurishning eng qulay usuli.
  • Iterable bo'lmagan narsani (undefined, oddiy obyekt) [ ] bilan ajratib bo'lmaydi — is not iterable.

Keyingi dars: Spread va rest operatori — ... belgisining ikki yuzini to'liq o'rganamiz: massiv va obyektni "yoyish" va qiymatlarni "yig'ish".

Ulashish:Telegram'da

Izohlar (0)

Izoh yozish uchun kiring.

  • Hozircha izoh yo'q. Birinchi bo'ling!
JavaScript massiv destructuring: elementlarni o'rni bo'yicha ajratish — IlmHamroh