4-bo‘lim

Sikllar

for, while, do...while, for...of va for...in sikllari, break va continue, ichma-ich sikllar va cheksiz sikldan saqlanish.

🕑 13 daqiqa o‘qish 📄 287 so‘z 👁 1 marta ko‘rilgan
Ushbu bo‘lim mundarijasi
  1. for sikli
  2. while sikli
  3. do...while
  4. for...of - eng qulay usul
  5. for...in - obyekt kalitlari
  6. break va continue
  7. Ichma-ich sikllar
  8. Cheksiz sikl xavfi
  9. Amaliy misol: ma'lumot yig'ish
  10. Sikl o'rniga massiv metodlari
  11. Xulosa

Kompyuterning eng katta afzalligi - charchamasdan takrorlash. Sikllar shu imkoniyatni beradi.

for sikli #

JavaScript
for (let i = 1; i <= 5; i++) {
    console.log(`${i} - takrorlanish`);
}
Natija
1 - takrorlanish
2 - takrorlanish
3 - takrorlanish
4 - takrorlanish
5 - takrorlanish
for siklining uch qismi for (let i = 1; i <= 5; i++) 1. Boshlash Faqat bir marta bajariladi 2. Shart Har takrorlanishdan oldin tekshiriladi 3. Qadam Har takrorlanishdan keyin bajariladi Tartib: 1 -> 2 -> tana -> 3 -> 2 -> tana -> 3 -> ...
Shart yolg'on bo'lganda sikl to'xtaydi

while sikli #

JavaScript
let qoldiq = 100;
let oy = 0;

while (qoldiq > 0) {
    qoldiq -= 30;
    oy++;
}

console.log(`Qarz ${oy} oyda to'landi`);
console.log(`Oxirgi qoldiq: ${qoldiq}`);
Natija
Qarz 4 oyda to'landi
Oxirgi qoldiq: -20
Qaysi siklni tanlash kerak?
SiklQachon
forTakrorlanishlar soni oldindan ma'lum
whileShart bo'yicha, soni noma'lum
do...whileKamida bir marta bajarilishi kerak
for...ofMassiv yoki satr elementlari bo'yicha
for...inObyekt kalitlari bo'yicha

Amalda for...of va massiv metodlari (map, filter) eng ko'p ishlatiladi. Klassik for esa indeks kerak bo'lganda qoladi.

do...while #

JavaScript
let urinish = 0;

do {
    urinish++;
    console.log(`${urinish}-urinish`);
} while (urinish < 3);

// Shart darhol yolg'on bo'lsa ham bir marta ishlaydi
let hech = 100;
do {
    console.log("Bu baribir chiqadi");
} while (hech < 10);
Natija
1-urinish
2-urinish
3-urinish
Bu baribir chiqadi

for...of - eng qulay usul #

JavaScript
const mevalar = ["olma", "anor", "uzum"];

for (const meva of mevalar) {
    console.log(meva);
}

// Satr ham element-element o'qiladi
for (const harf of "JS") {
    console.log(harf);
}

// Indeks ham kerak bo'lsa
for (const [indeks, meva] of mevalar.entries()) {
    console.log(`${indeks}: ${meva}`);
}
Natija
olma
anor
uzum
J
S
0: olma
1: anor
2: uzum

for...in - obyekt kalitlari #

JavaScript
const talaba = { ism: "Malika", yosh: 22, shahar: "Farg'ona" };

for (const kalit in talaba) {
    console.log(`${kalit}: ${talaba[kalit]}`);
}
Natija
ism: Malika
yosh: 22
shahar: Farg'ona
for...in ni massivda ishlatmang

for...in kalitlar bo'yicha yuradi. Massivda kalitlar - indekslar, lekin ular satr ko'rinishida keladi:

JavaScript
const sonlar = [10, 20, 30];

for (const i in sonlar) {
    console.log(typeof i, i);      // "string" 0, "string" 1, ...
}

Bu qo'shishda muammo tug'diradi:

JavaScript
for (const i in sonlar) {
    console.log(i + 1);            // "01", "11", "21" - satr ulanishi!
}

Yana bir muammo: for...in meros olingan xossalarni ham ko'radi va tartibni kafolatlamaydi.

Qoida:

  • Massiv uchun - for...of yoki massiv metodlari;
  • Obyekt uchun - for...in yoki Object.keys().

break va continue #

JavaScript
const sonlar = [3, 7, 12, 8, 15, 4];

// break - siklni butunlay to'xtatadi
for (const son of sonlar) {
    if (son > 10) {
        console.log(`Birinchi katta son: ${son}`);
        break;
    }
}

// continue - shu takrorlanishni o'tkazib yuboradi
console.log("Toq sonlar:");
for (const son of sonlar) {
    if (son % 2 === 0) {
        continue;
    }
    console.log("  " + son);
}
Natija
Birinchi katta son: 12
Toq sonlar:
  3
  7
  15

Ichma-ich sikllar #

JavaScript
// Ko'paytirish jadvali
for (let i = 2; i <= 4; i++) {
    let qator = "";

    for (let j = 1; j <= 5; j++) {
        qator += `${i}x${j}=${i * j}  `;
    }

    console.log(qator.trim());
}
Natija
2x1=2  2x2=4  2x3=6  2x4=8  2x5=10
3x1=3  3x2=6  3x3=9  3x4=12  3x5=15
4x1=4  4x2=8  4x3=12  4x4=16  4x5=20
Ichma-ich sikldan chiqish - yorliq (label)

Oddiy break faqat ichki siklni to'xtatadi. Ikkalasidan chiqish uchun yorliq ishlatiladi:

JavaScript
tashqi:
for (let i = 0; i < 5; i++) {
    for (let j = 0; j < 5; j++) {
        if (i * j > 6) {
            break tashqi;          // ikkala sikldan chiqadi
        }
    }
}

Yorliqlar kamdan-kam kerak bo'ladi. Ko'p hollarda kodni funksiyaga ajratib, return qilish tozaroq:

JavaScript
function qidirish(matritsa, nishon) {
    for (const qator of matritsa) {
        for (const katak of qator) {
            if (katak === nishon) {
                return true;       // hamma sikldan chiqadi
            }
        }
    }
    return false;
}

Cheksiz sikl xavfi #

JavaScript
// XAVFLI NAQSH - i hech qachon oshmaydi
// while (i < 10) { console.log(i); }

// To'g'ri: hisoblagich albatta o'zgaradi
let i = 0;
let qadam = 0;

while (i < 10) {
    i += 3;
    qadam++;

    // Xavfsizlik chegarasi - ishlab chiqishda foydali
    if (qadam > 1000) {
        console.log("Chegaraga yetildi - sikl to'xtatildi");
        break;
    }
}

console.log(`${qadam} qadamda i = ${i}`);
Natija
4 qadamda i = 12
Brauzerda cheksiz sikl sahifani muzlatadi

JavaScript brauzerda bitta oqimda ishlaydi. Cheksiz sikl butun sahifani - tugmalarni, aylantirish, hatto yopish tugmasini ham - bloklab qo'yadi.

Eng ko'p uchraydigan sabablar:

JavaScript
// 1. Hisoblagichni oshirishni unutish
let i = 0;
while (i < 10) {
    console.log(i);            // i o'zgarmaydi!
}

// 2. Sikl ichida massivga element qo'shish
for (const x of royxat) {
    royxat.push(x);            // ro'yxat hech qachon tugamaydi
}

// 3. Suzuvchi nuqta bilan aniq taqqoslash
for (let x = 0; x !== 1; x += 0.1) {
    // x hech qachon aynan 1 bo'lmaydi!
}

Uchinchisi ayniqsa xavfli - 2-bo'limdagi 0.1 + 0.2 muammosining o'zi. !== o'rniga < ishlating.

Node.js da Ctrl+C yordam beradi, brauzerda esa yorliqni majburan yopishga to'g'ri keladi.

Amaliy misol: ma'lumot yig'ish #

JavaScript
const xaridlar = [
    { mahsulot: "Non", narx: 5000, soni: 2 },
    { mahsulot: "Sut", narx: 12000, soni: 1 },
    { mahsulot: "Guruch", narx: 18000, soni: 3 }
];

let jami = 0;
let engQimmat = null;

for (const xarid of xaridlar) {
    const summa = xarid.narx * xarid.soni;
    jami += summa;

    if (engQimmat === null || summa > engQimmat.summa) {
        engQimmat = { nom: xarid.mahsulot, summa: summa };
    }

    console.log(`${xarid.mahsulot.padEnd(8)} ${summa} so'm`);
}

console.log("-".repeat(20));
console.log(`Jami:    ${jami} so'm`);
console.log(`Eng katta: ${engQimmat.nom} (${engQimmat.summa} so'm)`);
Natija
Non      10000 so'm
Sut      12000 so'm
Guruch   54000 so'm
--------------------
Jami:    76000 so'm
Eng katta: Guruch (54000 so'm)

Sikl o'rniga massiv metodlari #

JavaScript
const sonlar = [1, 2, 3, 4, 5, 6];

// Sikl bilan
let juftlar1 = [];
for (const son of sonlar) {
    if (son % 2 === 0) {
        juftlar1.push(son);
    }
}

// Metod bilan - bir qator
const juftlar2 = sonlar.filter((son) => son % 2 === 0);

console.log("Sikl bilan :", juftlar1);
console.log("Metod bilan:", juftlar2);

// Yig'indi
let yigindi1 = 0;
for (const son of sonlar) {
    yigindi1 += son;
}
const yigindi2 = sonlar.reduce((jami, son) => jami + son, 0);

console.log("Yig'indi   :", yigindi1, "va", yigindi2);
Natija
Sikl bilan : [ 2, 4, 6 ]
Metod bilan: [ 2, 4, 6 ]
Yig'indi   : 21 va 21
Metodlar sikldan sekinroq, lekin bu deyarli muhim emas

filter va map klassik for dan biroz sekinroq ishlaydi - ular har element uchun funksiya chaqiradi.

Lekin farq odatda millionlab element bo'lgandagina seziladi. Oddiy ro'yxatlarda (yuzlab, minglab element) farq mikrosekundlarda o'lchanadi va foydalanuvchi buni sezmaydi.

O'qilishi esa ancha yaxshi:

JavaScript
// Nima qilayotgani darhol ko'rinadi
const faolTalabalar = talabalar
    .filter((t) => t.faol)
    .map((t) => t.ism);

Qoida: avval o'qiladigan kod yozing. Tezlik muammosi haqiqatan paydo bo'lsa - o'lchang, keyin optimallashtiring.

7-bo'limda bu metodlarni batafsil ko'ramiz.

Amaliy topshiriq
  1. for bilan 1 dan 10 gacha sonlarni chiqaring.
  2. while bilan qarzni oylik to'lov bilan yoping.
  3. do...while kamida bir marta ishlashini isbotlang.
  4. for...of bilan massiv va satrni aylantiring.
  5. entries() bilan indeks va qiymatni birga oling.
  6. for...in ni massivda ishlatib, i + 1 natijasini ko'ring.
  7. break bilan birinchi mos elementni toping.
  8. continue bilan juft sonlarni o'tkazib yuboring.
  9. Ichma-ich sikl bilan ko'paytirish jadvalini chizing.
  10. filter va reduce bilan siklni qisqartiring.

Xulosa #

  • for - takrorlanishlar soni ma'lum bo'lganda.
  • while - shart bo'yicha, soni noma'lum.
  • do...while - kamida bir marta bajariladi.
  • for...of massiv va satr elementlari uchun eng qulay.
  • for...in obyekt kalitlari uchun; massivda ishlatmang.
  • for...in indekslarni satr sifatida beradi.
  • break siklni to'xtatadi, continue bitta qadamni o'tkazadi.
  • Ichma-ich sikldan chiqish uchun yorliq yoki return.
  • Cheksiz sikl brauzerda butun sahifani muzlatadi.
  • Suzuvchi nuqtali hisoblagichda !== emas, < ishlating.
  • Massiv metodlari sikldan o'qilishi qulayroq.

Keyingi bo'limda funksiyalar bilan tanishamiz.

Xatolik topdingizmi?

Imlo xatosi, ishlamaydigan kod yoki noto‘g‘ri ma‘lumotni ko‘rsangiz - bizga xabar bering. Har bir xabar administrator tomonidan ko‘rib chiqiladi.