IlmHamroh
JavaScript Full-stack/8-qism. JavaScript asoslari51/61-dars20 daqiqa
Mundarija (39)

JavaScript massivda qidirish: includes, indexOf, find, some va every

Qisqacha: Massivda element bormi — includes (true/false). Qayerda — indexOf (indeks yoki -1). Aniq qiymat emas, shartga mos birinchi element kerak bo'lsa — find (element yoki undefined) va findIndex (indeks yoki -1). "Kamida bittasi mosmi?" — some, "hammasi mosmi?" — every. Bu metodlarning hech biri massivni o'zgartirmaydi.

Bu darsda

  • includes, indexOf va lastIndexOf bilan aniq qiymatni qidira olasiz.
  • includes nega NaN ni topadi, indexOf esa topmasligini tushuntira olasiz.
  • find, findIndex, findLast va findLastIndex ga callback berib, shart bo'yicha qidira olasiz.
  • some va every bilan butun ro'yxat haqida "ha/yo'q" javob ola olasiz.
  • Har bir savol uchun to'g'ri metodni tanlay olasiz va boshlovchilarning 5 ta xatosini taniysiz.

Oldin bilishingiz kerak: Massiv bo'ylab yurish, Callback va HOF, Matn ichida qidirish.

1. Nega bu kerak?

Oldingi darsda massiv bo'ylab for...of bilan yurishni o'rgandik. Endi shu bilim bilan real masalani yechib ko'ramiz.

Jasur Telegram'da onlayn do'kon boti yuritadi. Bot faqat ba'zi viloyatlarga yetkazib beradi. Mijoz "Navoiy" deb yozdi. Yetkazamizmi?

js
const viloyatlar = ["Toshkent", "Samarqand", "Buxoro", "Navoiy"];
const mijoz = "Navoiy";

let bormi = false;
for (const v of viloyatlar) {
  if (v === mijoz) {
    bormi = true;
    break;
  }
}

console.log(bormi); // true

Ishlaydi. Lekin oddiy savol uchun 8 qator kod ketdi. Botda bunday savollar o'nlab bo'ladi: "shu mahsulot savatda bormi?", "qaysi biri 100 000 so'mdan qimmat?", "hammasi omborda bormi?".

JavaScript massivlarida bunday savollar uchun tayyor metodlar bor. Yuqoridagi 8 qator bitta qatorga aylanadi:

js
const viloyatlar = ["Toshkent", "Samarqand", "Buxoro", "Navoiy"];

console.log(viloyatlar.includes("Navoiy")); // true

Metod nima ekanini matn ichida qidirish darsidan eslaysiz: qiymatdan keyin nuqta, nom va qavs. Satrlarda includes va indexOf ni ko'rgan edik. Yaxshi xabar: massivda ham ular deyarli xuddi shunday ishlaydi.

2. includes — bormi yoki yo'qmi?

2.1 Asosiy ishlatilishi

includes (inglizcha "o'z ichiga oladi") massivda shu qiymat borligini tekshiradi. Javob — mantiqiy qiymat: true yoki false.

js
const savat = ["non", "sut", "tuxum"];

console.log(savat.includes("sut")); // true
console.log(savat.includes("go'sht")); // false

Natija true yoki false bo'lgani uchun uni to'g'ridan-to'g'ri if ichiga qo'yish qulay:

js
const viloyatlar = ["Toshkent", "Samarqand", "Buxoro"];
const mijoz = "Xiva";

if (viloyatlar.includes(mijoz)) {
  console.log("Yetkazib beramiz!");
} else {
  console.log(`Kechirasiz, ${mijoz}ga hozircha yetkazmaymiz.`);
}

Konsolda:

text
Kechirasiz, Xivaga hozircha yetkazmaymiz.

2.2 Qidiruv qat'iy: tur va harf muhim

includes qiymatni aynan qidiradi. 5 soni va "5" satri — ikki xil qiymat:

js
const raqamlar = [1, 5, 10];

console.log(raqamlar.includes(5)); // true
console.log(raqamlar.includes("5")); // false

Satrlarda katta-kichik harf ham farqlanadi: ["Navoiy"].includes("navoiy") — false. Shuning uchun real botda massivni ham, mijoz yozganini ham bir xil ko'rinishda saqlashadi. Masalan, hammasini kichik harfda:

js
const viloyatlar = ["toshkent", "navoiy", "buxoro"];
const mijoz = "NAVOIY";

console.log(viloyatlar.includes(mijoz.toLowerCase())); // true

toLowerCase() ni matnni o'zgartirish darsida o'rgangansiz: u satrni kichik harfga o'tkazadi.

2.3 Qidirishni o'rtadan boshlash

includes ga ikkinchi argument bersangiz, qidiruv shu indeksdan boshlanadi. Bu satrdagi includes bilan bir xil:

js
const navbat = ["Ali", "Malika", "Jasur", "Ali"];

console.log(navbat.includes("Malika", 2)); // false
console.log(navbat.includes("Ali", 1)); // true

navbat.includes("Malika", 2) — "2-indeksdan boshlab Malika bormi?" Malika 1-indeksda, qidiruv esa undan keyin boshlandi. Ikkinchi qatorda esa 3-indeksdagi Ali topildi.

Tekshirib ko'ring: const narxlar = [5000, 12000, 8000]; bo'lsa, narxlar.includes("12000") nima qaytaradi?

Javob

false. Massivda 12000 soni bor, biz esa "12000" satrini qidirdik. includes turni o'zgartirmaydi va aynan bir xil qiymatni qidiradi. Formadan kelgan matnni avval songa aylantirish kerak: narxlar.includes(Number("12000")) — true.

3. indexOf va lastIndexOf — qayerda turibdi?

3.1 indexOf — birinchi uchragan joy

Ba'zan "bormi?" emas, "qayerda?" degan savol turadi. indexOf qiymatning indeksini qaytaradi. Qiymat bo'lmasa — -1:

js
const mevalar = ["olma", "nok", "uzum", "nok"];

console.log(mevalar.indexOf("nok")); // 1
console.log(mevalar.indexOf("anor")); // -1

Ikkita "nok" bor, lekin indexOf birinchisini topib, to'xtaydi. Natija — 1.

Nega yo'q bo'lsa -1? Chunki 0 — haqiqiy indeks (birinchi element). Massivda -1 indeks bo'lmaydi. Shuning uchun u "topilmadi" degan belgi sifatida tanlangan.

3.2 Amaliyot: qiymat bo'yicha o'chirish

indexOf ning eng ko'p uchraydigan ishi — splice bilan birga elementni nomi bo'yicha o'chirish. splice indeks so'raydi, bizda esa faqat nom bor. indexOf indeksni topib beradi:

js
const savat = ["non", "sut", "tuxum", "choy"];
const ochirish = "tuxum";

const i = savat.indexOf(ochirish);
if (i !== -1) {
  savat.splice(i, 1);
}

console.log(savat); // [ 'non', 'sut', 'choy' ]

Keling, sekin ko'ramiz:

  1. savat.indexOf("tuxum") — 2. Tuxum 2-indeksda.
  2. if (i !== -1) — tuxum haqiqatan bormi? Bu tekshiruv muhim. Aks holda splice(-1, 1) oxirgi elementni — choyni — o'chirib yuborardi.
  3. savat.splice(2, 1) — 2-indeksdan 1 ta element o'chiriladi.

3.3 lastIndexOf — oxirgi uchragan joy

lastIndexOf qidiruvni massiv oxiridan boshlaydi va oxirgi uchragan joyni beradi:

js
const mevalar = ["olma", "nok", "uzum", "nok"];

console.log(mevalar.indexOf("nok")); // 1
console.log(mevalar.lastIndexOf("nok")); // 3

Indeks baribir boshidan sanaladi. lastIndexOf faqat qidiruv yo'nalishini o'zgartiradi.

Ikkala metod ham includes kabi ikkinchi argument oladi — qidiruv boshlanadigan indeks. Masalan, mevalar.indexOf("nok", 2) — 3: qidiruv 2-indeksdan boshlandi va birinchi nokni o'tkazib yubordi.

Maslahat: Faqat "bormi?" deb so'rasangiz — includes yozing, indexOf(...) !== -1 emas. Ikkalasi ham ishlaydi, lekin includes o'qishga qulayroq. indexOf ni indeksning o'zi kerak bo'lganda ishlating.

Tekshirib ko'ring: ["a", "b", "a", "c"] massivida indexOf("a"), lastIndexOf("a") va indexOf("d") nima qaytaradi?

Javob

0, 2 va -1. indexOf birinchi "a" ni topadi — 0-indeks. lastIndexOf oxiridan qidiradi va 2-indeksdagi "a" ni topadi. "d" massivda yo'q, shuning uchun -1.

4. NaN bilan kichik, lekin muhim farq

includes va indexOf deyarli bir xil ishlaydi. Faqat bitta farqi bor — NaN bilan:

js
const olchovlar = [36.6, NaN, 37.2];

console.log(olchovlar.indexOf(NaN)); // -1
console.log(olchovlar.includes(NaN)); // true

NaN massivda bor, lekin indexOf uni "topa olmadi". Nega?

Tenglik operatorlari darsida ko'rgan edik: JavaScript'da NaN === NaN — false. NaN — o'ziga ham teng bo'lmagan yagona qiymat. indexOf har bir elementni === bilan solishtiradi. Shuning uchun NaN ni hech qachon topmaydi.

includes esa boshqa qoidani ishlatadi — o'sha darsda aytilgan SameValueZero. Bu qoidada NaN o'ziga teng deb hisoblanadi.

Qidiruv indexOf (===) includes (SameValueZero)
NaN ni topadimi? Yo'q, -1 Ha, true
0 va -0 Bir xil Bir xil
5 va "5" Har xil Har xil

Qachon bu muhim? Masalan, sensor harorat o'lchamadi va ro'yxatga NaN tushdi. "Ro'yxatda buzuq o'lchov bormi?" degan savolga faqat includes to'g'ri javob beradi.

Tekshirib ko'ring: [1, NaN, 3].indexOf(NaN) va [1, NaN, 3].includes(NaN) nima qaytaradi?

Javob

-1 va true. indexOf === bilan solishtiradi, NaN === NaN esa false — demak topilmadi. includes SameValueZero qoidasini ishlatadi va NaN ni o'ziga teng deb biladi.

5. Shart bo'yicha qidirish: find

5.1 Muammo: aniq qiymat noma'lum

Jasurning do'konidagi narxlar ro'yxati:

js
const narxlar = [45000, 89000, 120000, 35000, 250000];

Savol: "100 000 so'mdan qimmat birinchi narx qaysi?" includes bu yerda yordam bermaydi. U aniq qiymatni qidiradi, biz esa qiymatni bilmaymiz — faqat shartni bilamiz.

Bunday savol uchun find (inglizcha "topmoq") metodi bor. Unga qiymat emas, callback — shartni tekshiradigan funksiya beriladi.

5.2 find ga callback berish

Callback va HOF darsini eslang: callback — boshqa funksiyaga berilgan va o'sha funksiya ichida chaqiriladigan funksiya. find ham shunday ishlaydi:

js
const narxlar = [45000, 89000, 120000, 35000, 250000];

const qimmat = narxlar.find((narx) => narx > 100000);

console.log(qimmat); // 120000

(narx) => narx > 100000 — bu callback. Arrow funksiya: narx ni oladi va narx > 100000 natijasini — true yoki false — qaytaradi.

find shu callback'ni har bir element uchun navbat bilan chaqiradi. Callback birinchi marta true qaytargan elementni find natija sifatida beradi.

5.3 Ichida nima bo'lyapti?

Buni o'z ko'zimiz bilan ko'raylik. Callback ichiga console.log qo'yamiz:

js
const narxlar = [45000, 89000, 120000, 35000, 250000];

const qimmat = narxlar.find((narx) => {
  console.log(`Tekshiryapman: ${narx}`);
  return narx > 100000;
});

console.log(`Topildi: ${qimmat}`);

Konsolda:

text
Tekshiryapman: 45000
Tekshiryapman: 89000
Tekshiryapman: 120000
Topildi: 120000

E'tibor bering: 35000 va 250000 tekshirilmadi ham. find birinchi mos elementni topgan zahoti to'xtaydi — xuddi for siklidagi break kabi. 250000 ham shartga mos, lekin u navbatga yetmadi.

Qadam narx narx > 100000 find nima qiladi
1 45000 false davom etadi
2 89000 false davom etadi
3 120000 true to'xtaydi, 120000 ni qaytaradi

Bu yerda callback jingalak qavsli, shuning uchun return yozdik. Bir qatorli arrow'da return yashirin bo'ladi — bu farqni arrow funksiyalar darsida ko'rgan edik.

5.4 Hech narsa topilmasa

Hech bir element shartga mos kelmasa, find undefined qaytaradi:

js
const narxlar = [45000, 89000, 35000];

const qimmat = narxlar.find((narx) => narx > 1000000);

console.log(qimmat); // undefined
console.log(qimmat ?? "Bunday mahsulot yo'q"); // Bunday mahsulot yo'q

?? — nullish coalescing operatori. Chap tomon undefined yoki null bo'lsa, o'ng tomondagi zaxira qiymat olinadi.

5.5 Callback'ning ikkinchi parametri — indeks

find callback'ni chaqirganda unga elementning o'zidan tashqari uning indeksini ham beradi. Kerak bo'lsa, ikkinchi parametr yozasiz:

js
const navbat = ["Ali", "Malika", "Jasur", "Dilnoza"];

const topilgan = navbat.find((ism, i) => i >= 2 && ism.length > 5);

console.log(topilgan); // Dilnoza

Shart: "2-indeksdan keyingi va nomi 5 harfdan uzun". Jasur 2-indeksda, lekin nomi 5 harf. Dilnoza — 3-indeksda va 7 harf. Callback nima olishini to'liq callback imzosi darsida ko'ramiz. Hozircha: birinchi parametr — element, ikkinchisi — indeks.

5.6 Eng ko'p uchraydigan holat: obyektlar ro'yxati

Real dasturlarda find ko'pincha obyektlar ro'yxatida ishlatiladi. Obyekt bilan ?. darsida qisqa tanishgan edik: { nom: "Choynak", narx: 85000 } — nomli qiymatlar to'plami, qiymat esa nuqta bilan olinadi. Obyektlarni to'liq keyingi darslardan birida o'rganamiz.

js
const mahsulotlar = [
  { nom: "Choynak", narx: 85000 },
  { nom: "Piyola", narx: 15000 },
  { nom: "Dasturxon", narx: 120000 },
];

const kerakli = mahsulotlar.find((m) => m.nom === "Piyola");

console.log(kerakli); // { nom: 'Piyola', narx: 15000 }
console.log(kerakli.narx); // 15000

Callback har bir obyektning nom xususiyatini tekshiradi. find butun obyektni qaytaradi — endi uning narxini ham, boshqa ma'lumotlarini ham olish mumkin. Online do'konda mahsulot sahifasi ochilganda aynan shunday qidiruv ishlaydi.

Tekshirib ko'ring: [3, 8, 12, 5].find((n) => n > 4) nima qaytaradi? Callback necha marta chaqiriladi?

Javob

8, callback 2 marta chaqiriladi. Birinchi 3 — shart false. Keyin 8 — shart true, find shu yerda to'xtaydi. 12 va 5 ham 4 dan katta, lekin ular tekshirilmaydi: find faqat birinchi mos elementni beradi.

6. findIndex — shartga mos elementning joyi

findIndex xuddi find kabi callback oladi. Farqi: elementning o'zini emas, indeksini qaytaradi. Topilmasa — -1, xuddi indexOf dagidek.

js
const qoldiq = [12, 5, 0, 8, 0];

console.log(qoldiq.findIndex((soni) => soni === 0)); // 2
console.log(qoldiq.findIndex((soni) => soni < 0)); // -1

Omborda har mahsulotning qoldig'i saqlangan. findIndex birinchi tugagan mahsulotning o'rnini topdi — 2-indeks.

indexOf(0) ham shu yerda 2 beradi. Farqi: indexOf faqat aniq qiymatni qidiradi, findIndex esa istalgan shartni — "5 dan kam", "juft son", "narxi 0". Shuning uchun obyektlar ro'yxatidan o'chirishda indexOf o'rniga findIndex + splice ishlatiladi:

js
const savat = [
  { nom: "Kitob", narx: 60000 },
  { nom: "Sovg'a xaltasi", narx: 0 },
  { nom: "Daftar", narx: 8000 },
];

const i = savat.findIndex((m) => m.narx === 0);
if (i !== -1) {
  savat.splice(i, 1);
}

console.log(savat.length); // 2

7. Oxiridan qidirish: findLast va findLastIndex

find va findIndex massiv boshidan qidiradi. Ba'zan esa oxirgi mos element kerak bo'ladi. Masalan, Click'dagi to'lovlar tarixidan eng oxirgi katta to'lovni topish.

Buning uchun findLast va findLastIndex bor. Ular xuddi shunday callback oladi, faqat qidiruvni oxiridan boshlaydi:

js
const tolovlar = [50000, 1200000, 30000, 2500000, 70000];

const oxirgiKatta = tolovlar.findLast((t) => t >= 1000000);
const uningJoyi = tolovlar.findLastIndex((t) => t >= 1000000);

console.log(oxirgiKatta); // 2500000
console.log(uningJoyi); // 3

find bu yerda 1200000 ni bergan bo'lardi — boshidan birinchi mos kelgan. findLast esa oxiridan boshladi: 70000 mos emas, keyingi 2500000 — mos. Indeks baribir boshidan sanaladi — 3.

Topilmasa — findLast undefined, findLastIndex -1 qaytaradi. Qoida o'zgarmaydi.

Maslahat: findLast va findLastIndex JavaScript'ga 2023-yilda (ES2023 standarti) qo'shilgan. Hamma zamonaviy brauzer va Node 18+ ularni biladi. Eski kodda o'rniga massivni teskari aylantirib, keyin find qilishgan — bunday kodni ko'rsangiz, hayron bo'lmang.

Tekshirib ko'ring: const b = [4, 9, 2, 7]; bo'lsa, b.find((n) => n > 5) va b.findLast((n) => n > 5) nima qaytaradi?

Javob

9 va 7. find boshidan qidiradi: 4 — yo'q, 9 — ha. findLast oxiridan qidiradi: 7 — darhol ha.

8. some va every — butun ro'yxat haqida "ha" yoki "yo'q"

8.1 some — kamida bittasi mosmi?

Ba'zan element kerak emas, faqat javob kerak: "ro'yxatda shunday narsa bormi?" some (inglizcha "ba'zi") callback'ni har element uchun chaqiradi. Kamida bitta element uchun true chiqsa — true qaytaradi:

js
const baholar = [4, 5, 3, 5, 2];

console.log(baholar.some((b) => b === 2)); // true
console.log(baholar.some((b) => b > 5)); // false

"Sinfda ikki olgan o'quvchi bormi?" — ha. "5 dan yuqori baho bormi?" — yo'q.

includes(2) ham birinchi savolga javob berardi. Lekin some istalgan shartni tekshiradi: "3 dan past baho bormi?" — baholar.some((b) => b < 3).

8.2 every — hammasi mosmi?

every (inglizcha "har bir") — aksincha. U hamma element shartga mos kelsagina true qaytaradi. Bitta mos kelmasa — false:

js
const qoldiq = [12, 5, 3, 8];

console.log(qoldiq.every((soni) => soni > 0)); // true
console.log(qoldiq.every((soni) => soni >= 5)); // false

"Hamma mahsulot omborda bormi?" — ha, hammasining qoldig'i 0 dan katta. "Har biridan kamida 5 tadan bormi?" — yo'q, bittasida 3 ta.

Formalarni tekshirishda every juda qulay. Masalan, ro'yxatdan o'tish formasidagi hamma maydon to'ldirilganmi?

js
const maydonlar = ["Malika", "malika@mail.uz", ""];

const hammasiToldirilgan = maydonlar.every((m) => m !== "");

console.log(hammasiToldirilgan); // false

Uchinchi maydon bo'sh, shuning uchun forma yuborilmaydi.

8.3 Ular ham erta to'xtaydi

some birinchi true topgan zahoti to'xtaydi — javob allaqachon "ha". every esa birinchi false da to'xtaydi — javob allaqachon "yo'q".

Bu sizga tanish: mantiqiy operatorlar darsidagi qisqa tutashuv. some — elementlar orasiga || qo'yilgandek ishlaydi, every — && qo'yilgandek.

Metod Qachon true Qayerda to'xtaydi
some Kamida bittasi mos Birinchi true da
every Hammasi mos Birinchi false da

8.4 Bo'sh massiv — kutilmagan javob

Bo'sh massivda bu ikki metod qiziq javob beradi:

js
const bosh = [];

console.log(bosh.some((n) => n > 0)); // false
console.log(bosh.every((n) => n > 0)); // true

some — false: bo'sh ro'yxatda mos keladigan element yo'q, bu tushunarli. every esa true qaytardi. Boshida bu g'alati tuyulishi tabiiy.

Mantiq shunday: every "qoidani buzgan element bormi?" deb qidiradi. Bo'sh ro'yxatda qoidani buzadigan element yo'q — demak "hammasi joyida". Tasavvur qiling: o'qituvchi "bugun hamma uy vazifasini topshirdimi?" deb so'radi, sinfda esa bugun hech kim yo'q. Topshirmagan birorta o'quvchi yo'q, rasmiy javob — "ha".

Bu real kodda xatoga olib kelishi mumkin. Masalan, savat bo'sh bo'lsa, savat.every(...) "hammasi to'lovga tayyor" deydi. Shuning uchun bunday joyda avval savat.length > 0 ni ham tekshiring.

Tekshirib ko'ring: const yoshlar = [19, 22, 17, 25]; bo'lsa, yoshlar.some((y) => y < 18) va yoshlar.every((y) => y >= 18) nima qaytaradi?

Javob

true va false. 17 yoshli bitta odam bor — "18 dan kichik kimdir bormi?" savoliga javob "ha". Aynan shu odam tufayli "hammasi 18 dan kattami?" savoliga javob "yo'q". Bu ikki savol bir-birining teskarisi.

9. Qaysi metodni tanlash kerak?

Hamma metodni bitta jadvalda ko'raylik. Avval savolingizni aniqlang — metod o'zi tanlanadi:

Savolingiz Metod Nima qaytaradi
Shu qiymat bormi? includes true / false
Shu qiymat qayerda? indexOf, lastIndexOf indeks yoki -1
Shartga mos birinchi element? find element yoki undefined
U qayerda? findIndex indeks yoki -1
Shartga mos oxirgi element? findLast, findLastIndex element / indeks
Kamida bittasi mosmi? some true / false
Hammasi mosmi? every true / false

Bitta oddiy qoida: aniq qiymat qidirsangiz — qavsga qiymat (includes("Navoiy")). Shart bo'yicha qidirsangiz — qavsga funksiya (find((n) => n > 5)).

Va eng muhimi: bu darsdagi hech bir metod massivni o'zgartirmaydi. Ular faqat qarab chiqadi va javob beradi. push yoki splice dan farqli ravishda, asl massiv joyida qoladi.

9.1 O'zingiz to'ldiring

Taksi ilovasida haydovchilar reytingi saqlangan: [4.9, 4.7, 3.8, 5.0, 4.2]. Uchta savolga javob kerak. Kodning yarmi tayyor, qaysi metod kerakligini siz tanlaysiz:

js
const reyting = [4.9, 4.7, 3.8, 5.0, 4.2];

// 4.5 dan past birinchi reyting (element kerak)
const past = reyting.____((r) => r < 4.5);
// uning indeksi
const joyi = reyting.____((r) => r < 4.5);
// hamma reyting 3 dan yuqorimi? (true/false)
const yaxshi = reyting.____((r) => r > 3);
  • past uchun metod: reyting..
  • joyi uchun metod: reyting..
  • yaxshi uchun metod: reyting..
  • 4.2 ham 4.5 dan past. Lekin past ga 3.8 tushadi, chunki find faqat mos elementni beradi.
Javob
js
const reyting = [4.9, 4.7, 3.8, 5.0, 4.2];

const past = reyting.find((r) => r < 4.5);
const joyi = reyting.findIndex((r) => r < 4.5);
const yaxshi = reyting.every((r) => r > 3);

console.log(past); // 3.8
console.log(joyi); // 2
console.log(yaxshi); // true

Element kerak — find, indeks kerak — findIndex, "hammasi?" — every. Konsolda 5.0 emas, 5 ko'rinishini ham bilib qo'ying: JavaScript uchun 5.0 va 5 — bitta son.

10. Ko'p uchraydigan xatolar

10.1 indexOf natijasini to'g'ridan-to'g'ri if ga qo'yish

js
const navbat = ["Ali", "Malika"];

if (navbat.indexOf("Ali")) {
  console.log("Ali navbatda");
} else {
  console.log("Ali yo'q");
}

Konsolda:

text
Ali yo'q

Ali navbatda turibdi, lekin kod "yo'q" dedi. Nega? indexOf("Ali") — 0, chunki Ali birinchi. 0 esa falsy qiymat — if uni "yolg'on" deb tushunadi. Aksincha, topilmasa -1 qaytadi, -1 esa truthy.

Tuzatish: "bormi?" savoli uchun includes ishlating: if (navbat.includes("Ali")). Indeks baribir kerak bo'lsa — -1 bilan aniq solishtiring: if (navbat.indexOf("Ali") !== -1).

10.2 find natijasini tekshirmasdan ishlatish

js
const mahsulotlar = [
  { nom: "Choynak", narx: 85000 },
  { nom: "Piyola", narx: 15000 },
];

const topilgan = mahsulotlar.find((m) => m.nom === "Qozon");
console.log(topilgan.narx);
text
TypeError: Cannot read properties of undefined (reading 'narx')

Tarjimasi: "undefined ning xususiyatlarini o'qib bo'lmaydi (narx ni o'qishda)". Qozon ro'yxatda yo'q, shuning uchun find undefined qaytardi. Keyin biz undefined.narx ni so'radik — dastur to'xtadi.

Tuzatish: find natijasi doim undefined bo'lishi mumkinligini unutmang. if bilan tekshiring yoki ?. ishlating:

js
const mahsulotlar = [{ nom: "Choynak", narx: 85000 }];

const topilgan = mahsulotlar.find((m) => m.nom === "Qozon");
console.log(topilgan?.narx ?? "Topilmadi"); // Topilmadi

10.3 Jingalak qavsli callback'da return ni unutish

js
const narxlar = [45000, 120000, 35000];

const qimmat = narxlar.find((narx) => {
  narx > 100000;
});

console.log(qimmat); // undefined

120000 bor, lekin find hech narsa topmadi. Sababi: callback jingalak qavs ichida, return esa yo'q. Bunday funksiya har doim undefined qaytaradi. undefined esa falsy — find uchun bu "mos emas" degani. Xato xabari yo'q, shuning uchun bu xatoni topish qiyin.

Tuzatish: return narx > 100000; deb yozing yoki qavssiz qisqa shaklga o'ting: (narx) => narx > 100000.

10.4 Obyektni includes bilan qidirish

js
const savat = [{ nom: "Non" }, { nom: "Sut" }];

console.log(savat.includes({ nom: "Non" })); // false

Ko'rinishi bir xil obyekt bor, lekin javob false. Ma'lumot turlari darsida ko'rgandik: obyekt o'zgaruvchida havola sifatida saqlanadi. Qavs ichidagi { nom: "Non" } — yangi, alohida obyekt. Massivdagisi bilan ichi bir xil, lekin ular ikki xil "quti".

Tuzatish: obyektni xususiyati bo'yicha qidiring: savat.some((m) => m.nom === "Non") — true. Havolalar haqida batafsil — havola semantikasi darsida.

10.5 Mavjud bo'lmagan metod nomi

js
const mevalar = ["olma", "nok"];

console.log(mevalar.contains("olma"));
text
TypeError: mevalar.contains is not a function

Tarjimasi: "mevalar.contains — funksiya emas". Boshqa dasturlash tillarida contains yoki has bor. JavaScript massivida bunday metod yo'q — mevalar.contains undefined bo'ladi, undefined ni esa chaqirib bo'lmaydi. Tuzatish: includes yozing. Bu xabarni ko'rsangiz, metod nomini harfma-harf tekshiring.

11. Mashqlar

1-mashq (oson): Menyu tekshiruvi

Choyxona menyusi: ["osh", "shashlik", "lag'mon", "manti", "somsa"].

  1. includes bilan menyuda "manti" borligini tekshiring.
  2. indexOf bilan "lag'mon" ning o'rnini toping.
  3. includes bilan "pitsa" bormi — tekshiring.

Har bir natijani console.log bilan chiqaring. Eslatma: lag'mon so'zida apostrof bor — satrni qo'shtirnoq "..." bilan yozing.

Yechim
js
const menyu = ["osh", "shashlik", "lag'mon", "manti", "somsa"];

console.log(menyu.includes("manti")); // true
console.log(menyu.indexOf("lag'mon")); // 2
console.log(menyu.includes("pitsa")); // false

includes "bormi?" savoliga true/false beradi. indexOf joyni beradi: osh — 0, shashlik — 1, lag'mon — 2.

2-mashq (o'rta): Imtihon natijalari

Guruhning test ballari: [72, 85, 56, 91, 64, 48, 77]. O'tish bali — 60.

  1. find bilan 90 va undan yuqori birinchi ballni toping.
  2. findIndex bilan o'tolmagan (60 dan past) birinchi talabaning indeksini toping.
  3. some bilan kamida bitta talaba o'tolmaganini tekshiring.
  4. every bilan hamma 40 dan yuqori ball olganini tekshiring.

Ishora: har biriga arrow callback yozing, masalan (ball) => ball >= 90.

Yechim
js
const ballar = [72, 85, 56, 91, 64, 48, 77];

const alochi = ballar.find((ball) => ball >= 90);
const birinchiYiqilgan = ballar.findIndex((ball) => ball < 60);
const kimdirYiqildi = ballar.some((ball) => ball < 60);
const hammasi40danYuqori = ballar.every((ball) => ball > 40);

console.log(alochi); // 91
console.log(birinchiYiqilgan); // 2
console.log(kimdirYiqildi); // true
console.log(hammasi40danYuqori); // true

findIndex 2 qaytardi: 56 bali 2-indeksda. 48 ham 60 dan past, lekin u keyinroq turibdi — findIndex birinchisida to'xtaydi. every — true, chunki eng past ball 48, u ham 40 dan yuqori.

3-mashq (qiyin): Yetkazib berish boti

Jasurning botiga funksiya kerak. yetkazishMumkinmi(viloyat, savat) funksiyasi ikki narsani tekshirsin:

  • Viloyat ro'yxatda bormi: ["toshkent", "samarqand", "buxoro", "navoiy"]. Mijoz katta harf bilan yozishi mumkin — toLowerCase() ishlating.
  • Savatdagi hamma mahsulot omborda bormi: har bir mahsulot obyektida qoldiq xususiyati bor, u 0 dan katta bo'lishi kerak.

Savat bo'sh bo'lsa, funksiya false qaytarsin (bo'sh massivda every nima qaytarishini eslang). Hammasi joyida bo'lsa — true.

Ishora: funksiya ichida avval viloyatni tekshirib, erta qaytish (return false) qiling.

Yechim
js
const viloyatlar = ["toshkent", "samarqand", "buxoro", "navoiy"];

function yetkazishMumkinmi(viloyat, savat) {
  if (!viloyatlar.includes(viloyat.toLowerCase())) {
    return false;
  }
  if (savat.length === 0) {
    return false;
  }
  return savat.every((m) => m.qoldiq > 0);
}

const savat1 = [
  { nom: "Choynak", qoldiq: 4 },
  { nom: "Piyola", qoldiq: 12 },
];
const savat2 = [
  { nom: "Choynak", qoldiq: 4 },
  { nom: "Dasturxon", qoldiq: 0 },
];

console.log(yetkazishMumkinmi("Buxoro", savat1)); // true
console.log(yetkazishMumkinmi("Xiva", savat1)); // false
console.log(yetkazishMumkinmi("NAVOIY", savat2)); // false
console.log(yetkazishMumkinmi("Toshkent", [])); // false
  • Birinchi chaqiruv: Buxoro ro'yxatda, ikkala mahsulot omborda — true.
  • Ikkinchi: Xiva ro'yxatda yo'q — funksiya birinchi if da qaytdi.
  • Uchinchi: viloyat to'g'ri, lekin Dasturxon tugagan — every false berdi.
  • To'rtinchi: savat bo'sh. length tekshiruvisiz every bu yerda true qaytargan bo'lardi.

12. Real ishda

Bu metodlar deyarli har bir JavaScript loyihasida bor:

  • Online do'kon: mahsulot sahifasi ochilganda ro'yxatdan find bilan kerakli mahsulot olinadi. "Savatda bormi?" — some.
  • Formalar: "hamma maydon to'g'ri to'ldirilganmi?" — every. Kamida bitta xato bo'lsa, "Yuborish" tugmasi o'chiriladi.
  • Ruxsatlar: "foydalanuvchining rollari ichida admin bormi?" — includes.
  • React (sayt yasash uchun mashhur vosita, kursda alohida o'rganamiz): ro'yxatdan bitta elementni yangilash yoki o'chirish uchun avval findIndex bilan uning joyi topiladi.

Intervyularda ko'p so'raladigan savollar: "find va filter farqi nima?" (filter — keyingi darslardan birida). "includes va indexOf farqi nima?" — javob: NaN va natija turi. Endi siz bunga javob bera olasiz.

Xulosa

  • includes — "bormi?" (true/false); indexOf/lastIndexOf — "qayerda?" (indeks yoki -1).
  • includes NaN ni topadi (SameValueZero), indexOf topmaydi (===).
  • find/findIndex shart bo'yicha birinchi mos elementni yoki indeksni beradi; findLast/findLastIndex — oxiridan.
  • find topmasa — undefined: natijani ?. yoki if bilan tekshiring.
  • some — kamida bittasi, every — hammasi. Bo'sh massivda every true beradi.
  • Hech biri massivni o'zgartirmaydi.

Keyingi dars: Kesish, birlashtirish va matnga aylantirish — massivdan bo'lak kesib olish, ikki massivni qo'shish va massivni chiroyli matnga aylantirishni o'rganamiz.

Ulashish:Telegram'da

Izohlar (0)

Izoh yozish uchun kiring.

  • Hozircha izoh yo'q. Birinchi bo'ling!
JavaScript massivda qidirish: includes, indexOf, find, some va every — IlmHamroh