Mundarija (32)
- Bu darsda
- 1. Nega bu kerak?
- 2. Asosiy sintaksis
- 2.1 Birinchi misol
- 2.2 Tartib muhim, nom erkin
- 2.3 Element kam yoki ko'p bo'lsa
- 2.4 Satrni ham ajratish mumkin
- 3. Elementni o'tkazib yuborish
- 4. Default qiymat
- 5. Qolganini yig'ish: ...qolgan
- 5.1 Rest element
- 5.2 Rest — faqat oxirida
- 6. Ikki o'zgaruvchini almashtirish (swap)
- 6.1 Eski usul: uchinchi "stakan"
- 6.2 Destructuring bilan — bitta qatorda
- 6.3 ASI tuzog'i: [ bilan boshlanadigan qator
- 7. Funksiyadan bir nechta qiymat qaytarish
- 8. for...of ichida destructuring
- 8.1 Object.entries bilan
- 8.2 Massivning entries() metodi bilan
- 8.3 Aralash: obyekt ichida massiv, massiv ichida massiv
- 9. Ko'p uchraydigan xatolar
- 9.1 undefined yoki obyektni massiv kabi ajratish
- 9.2 Tartibni adashtirish
- 9.3 Swap'dan oldin nuqta-vergul yo'q
- 9.4 const o'zgaruvchini almashtirish
- 10. Mashqlar
- 1-mashq (oson): Sana bo'laklari
- 2-mashq (o'rta): Musobaqa natijalari
- 3-mashq (qiyin): Oylik hisobot
- 11. Real ishda
- Xulosa
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...qolganbilan yig'asiz. Ikki o'zgaruvchining qiymatini[a, b] = [b, a];bilan almashtirish mumkin.
Bu darsda
const [a, b] = massivbilan 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.entriesvafor...ofni destructuring bilan birga ishlatasiz.is not iterablexatosini 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:
const toliqIsm = "Malika Karimova";
const qismlar = toliqIsm.split(" ");
const ism = qismlar[0];
const familiya = qismlar[1];
console.log(ism); // Malika
console.log(familiya); // KarimovaIshlaydi. 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
const toliqIsm = "Malika Karimova";
const [ism, familiya] = toliqIsm.split(" ");
console.log(ism); // Malika
console.log(familiya); // KarimovaObyekt 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:
const koordinata = [41.31, 69.28];
const [kenglik, uzunlik] = koordinata;
console.log(kenglik); // 41.31
console.log(uzunlik); // 69.28Tartibni almashtirsangiz, qiymatlar ham almashadi:
const koordinata = [41.31, 69.28];
const [uzunlik, kenglik] = koordinata; // ❌ tartib adashdi
console.log(uzunlik); // 41.31JavaScript 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:
const gollar = [3, 1, 2, 0];
const [birinchiOyin] = gollar;
console.log(birinchiOyin); // 3O'zgaruvchi elementlardan ko'p bo'lsa — yetmaganlariga undefined yoziladi. Xuddi massivda yo'q indeksni o'qigandagidek (gollar[10]):
const ranglar = ["qizil", "yashil"];
const [a, b, c] = ranglar;
console.log(a); // qizil
console.log(b); // yashil
console.log(c); // undefined2.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:
const [birinchiHarf, ikkinchiHarf] = "Toshkent";
console.log(birinchiHarf); // T
console.log(ikkinchiHarf); // oSatr 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?
jsconst [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 keyinyoshnimaga 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:
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:
const podium = ["Ali", "Vali", "Guli"];
const [oltin, , bronza] = podium;
console.log(oltin); // Ali
console.log(bronza); // GuliIkki 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 keyinuchinchinimaga 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:
const sozlama = "qorong'i".split(",");
const [mavzu, til = "uz"] = sozlama;
console.log(mavzu); // qorong'i
console.log(til); // uzsplit 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:
const [x = 1, y = 2] = [undefined, null];
console.log(x); // 1
console.log(y); // nullx 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:
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:
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:
const [birinchi, ...ortasi, oxirgi] = [1, 2, 3, 4];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 keyinqolgannimaga 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:
let kunduzgi = "Rustam";
let kechki = "Sardor";
const vaqtincha = kunduzgi;
kunduzgi = kechki;
kechki = vaqtincha;
console.log(kunduzgi, kechki); // Sardor RustamNega 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
let kunduzgi = "Rustam";
let kechki = "Sardor";
[kunduzgi, kechki] = [kechki, kunduzgi];
console.log(kunduzgi, kechki); // Sardor RustamBu 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
constyokiletyo'q — o'zgaruvchilar allaqachon mavjud, biz faqat yangi qiymat beryapmiz. - Shuning uchun ular
letbilan e'lon qilingan bo'lishi kerak.constni 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:
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:
let chap = "Ali";
let ong = "Vali";
console.log("Almashtiramiz...")
[chap, ong] = [ong, chap];Konsolda avval Almashtiramiz... chiqadi, keyin qizil xato:
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:
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:
let chap = "Ali";
let ong = "Vali";
console.log("Almashtiramiz...");
[chap, ong] = [ong, chap];
console.log(chap, ong);Konsolda:
Almashtiramiz...
Vali AliDiqqat: 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 vaongni 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 qatordaani 8 ga,bni 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:
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); // 1Uch 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:
const narxlar = { non: 4000, sut: 12000, tuxum: 18000 };
console.log(Object.entries(narxlar));Konsolda:
[ [ 'non', 4000 ], [ 'sut', 12000 ], [ 'tuxum', 18000 ] ]Har bir juftlik — ikki elementli massiv: [kalit, qiymat]. Destructuringsiz uni shunday aylanardik:
const narxlar = { non: 4000, sut: 12000 };
for (const juft of Object.entries(narxlar)) {
console.log(`${juft[0]}: ${juft[1]} so'm`);
}Konsolda:
non: 4000 so'm
sut: 12000 so'mjuft[0] va juft[1] — yana o'sha "sehrli raqamlar". Endi destructuring bilan:
const narxlar = { non: 4000, sut: 12000, tuxum: 18000 };
for (const [mahsulot, narx] of Object.entries(narxlar)) {
console.log(`${mahsulot}: ${narx} so'm`);
}Konsolda:
non: 4000 so'm
sut: 12000 so'm
tuxum: 18000 so'mBu 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:
const hujumchilar = ["Shomurodov", "Masharipov", "Fayzullayev"];
for (const [i, futbolchi] of hujumchilar.entries()) {
console.log(`${i + 1}. ${futbolchi}`);
}Konsolda:
1. Shomurodov
2. Masharipov
3. FayzullayevIndeks 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:
const talaba = { ism: "Jasur", baholar: [5, 4, 5] };
const { ism, baholar: [birinchiBaho] } = talaba;
console.log(ism, birinchiBaho); // Jasur 5baholar: [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 }))siklidakvavnimaga 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
function narxlarniOl() {
// hech narsa qaytarmadi
}
const [birinchi] = narxlarniOl();TypeError: narxlarniOl is not a function or its return value is not iterableTarjimasi: "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:
const talaba = { ism: "Ali", yosh: 19 };
const [ism, yosh] = talaba;TypeError: talaba is not iterableOddiy 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.
const javob = undefined;
const [birinchi = "yo'q"] = javob ?? [];
console.log(birinchi); // yo'q9.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
const a = 1;
const b = 2;
[a, b] = [b, a];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
const sana = "27.09.2026";
const [kun, oy, yil] = sana.split(".");
console.log(`Yil: ${yil}, oy: ${oy}, kun: ${kun}`);
// Yil: 2026, oy: 09, kun: 27split(".") → ["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
golibnomli o'zgaruvchiga; - ikkinchi o'rinni o'tkazib yuborib;
- qolganlarini
qolganlarmassiviga oling.
Keyin G'olib: Madina va Qolganlar soni: 3 ni chiqaring.
const natijalar = ["Madina", "Otabek", "Sevara", "Nodir", "Kamola"];Yechim
const natijalar = ["Madina", "Otabek", "Sevara", "Nodir", "Kamola"];
const [golib, , ...qolganlar] = natijalar;
console.log(`G'olib: ${golib}`);
console.log(`Qolganlar soni: ${qolganlar.length}`);Konsolda:
G'olib: Madina
Qolganlar soni: 3golib — 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.
const daromad = { yanvar: 4200000, fevral: 5100000, mart: 3900000 };Kutilgan natija:
yanvar: 4200000 so'm
fevral: 5100000 so'm
mart: 3900000 so'm
Eng yaxshi oy: fevralIshora: sikldan oldin let engYaxshiOy = ""; va let engKatta = 0; e'lon qiling. Sikl ichida joriy summa engKatta dan katta bo'lsa — ikkalasini yangilang.
Yechim
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:
yanvar: 4200000 so'm
fevral: 5100000 so'm
mart: 3900000 so'm
Eng yaxshi oy: fevralObject.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 —
splitva 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 (faqatundefinedda),[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".
Izohlar (0)
Izoh yozish uchun kiring.
- Hozircha izoh yo'q. Birinchi bo'ling!