Js tsikli orqali tashqi o'zgaruvchini o'zgartirish. Looplar uchun JavaScript

Ushbu chekinishni kodning murakkabligining ko'rsatkichi deb hisoblash mumkin (juda qo'pol bo'lsa ham). Indentsning o'zi neytraldir, chunki ular shunchaki matnni formatlash vositasidir, ammo gap shundaki, ular dasturlarning maxsus bloklarini, masalan, boshqaruv tuzilmalarini ajratib ko'rsatish uchun ishlatiladi. Kodni o'qib, chekinishga duch kelgan dasturchi, ajratilgan blok mavjud bo'lgan kontekstni xotirada saqlash uchun chekinish nimani anglatishini hisobga olishga majbur bo'ladi. Bu, albatta, agar kodning chuqurlashtirilgan qismida boshqa maxsus fragment paydo bo'lsa, takrorlanadi.

Agar siz matnlarning mazmuniga e'tibor bermasangiz, unda odatda murakkab kod shunday ko'rinadi, uning bo'limlari yon tomonda joylashgan "V" harflariga o'xshaydi va oddiy kod, agar siz hisobga olmasangiz, uning bloki. chiziqlarning turli uzunligini hisobga oling, to'rtburchakga o'xshaydi.


Qanchalik ko'p chekinsa, kod odatda shunchalik murakkab bo'ladi.

Chiqib ketish kerak bo'lgan konstruktsiyalar har doim kodda bo'ladi, ulardan butunlay qutulish haqida gap yo'q. Biroq, biz duch keladigan muammolarni hal qilish uchun abstraktsiyalarni oqilona tanlash orqali yozadigan dasturlarning murakkabligini kamaytirish bizning qo'limizda.

Masalan, massivlarni olaylik. An'anaga ko'ra, ularni qayta ishlash uchun har xil turdagi tsikllar qo'llaniladi. Ko'pgina dasturchilarning ongida "massiv" va "loop" tushunchalari uzviy bog'liqdir. Biroq, tsikl juda noaniq qurilishdir. Luis Atenzio o‘zining JavaScript-da funktsional dasturlash kitobida tsikllar haqida shunday yozadi: “Loop – bu qattiq boshqaruv konstruksiyasi bo‘lib, uni qayta ishlatish oson emas va boshqa operatsiyalar bilan birlashtirish qiyin. Bundan tashqari, looplardan foydalanish har bir iteratsiya bilan o'zgarib turadigan kodni anglatadi.


Looplardan qutulish mumkinmi?

Tsikl asosiy tuzilmaviy boshqaruv tuzilmalaridan biridir va aslida biz sikllarni yo'q qilish kerak bo'lgan yomon deb aytmoqchi emasmiz. Bizning asosiy maqsadimiz massivlarni qayta ishlashda tsikllardan foydalanishni minimallashtirish orqali o'z kodimizning murakkabligini kamaytirishdir. Buni iloji bormi? Sizni birgalikda bilib olishga taklif qilamiz.

Velosipedlar

Biz allaqachon tsikllar kabi boshqaruv konstruksiyalari sizning kodingizga qanday murakkablik kiritishi haqida gapirgan edik. Lekin nega bu shunday? Keling, JavaScript-da tsikllar qanday ishlashini ko'rib chiqaylik.

JS da sikllarni tashkil qilishning bir necha usullari mavjud. Xususan, halqalarning asosiy turlaridan biri while. Tafsilotlarga kirishdan oldin, keling, biroz tayyorlanaylik. Ya'ni, biz ishlaydigan funktsiya va massivni yaratamiz.

// oodlify :: String -> String funksiyasi oodlify(s) (qaytish s.replace (// g, "oodle");) const input = ["Jon", "Paul", "Jorj", "Ringo", ];
Demak, bizda massiv bor, uning har bir elementini oodlify funksiyasi yordamida qayta ishlaymiz. Ushbu muammoni hal qilish uchun while tsiklidan foydalansangiz, siz quyidagilarni olasiz:

i = 0 bo'lsin; const len ​​= input.length; chiqsin =; esa (ya'ni< len) { let item = input[i]; let newItem = oodlify(item); output.push(newItem); i = i + 1; }
Esda tutingki, biz massivning hozirda qayta ishlangan elementini kuzatib borish uchun i hisoblagichidan foydalanamiz. Siz uni nolga tenglashtirishingiz va tsiklning har bir iteratsiyasida uni bittaga oshirishingiz kerak. Bundan tashqari, qachon ishlashni to'xtatish kerakligini bilish uchun uni massiv uzunligi bilan, len bilan solishtirish kerak.

Bu naqsh shunchalik keng tarqalganki, JavaScript-da bunday konstruksiyani tashkil qilishning osonroq usuli, for tsikli mavjud. Bunday tsikl xuddi shu muammoni quyidagi tarzda hal qiladi:

Const len ​​= input.length; chiqsin =; uchun (i = 0; i< len; i = i + 1) { let item = input[i]; let newItem = oodlify(item); output.push(newItem); }
For tsikli foydali konstruksiyadir, chunki u barcha standart hisoblagich operatsiyalarini o'z ichiga oladi yuqori qismi blok. Vaqt o'tishi bilan i hisoblagichini ko'paytirishni unutish oson, bu cheksiz tsiklni boshlaydi. Albatta, for loop ancha qulayroq while tsikli... Ammo keling, sekinlashtiramiz va kodimiz nimaga erishmoqchi ekanligini ko'rib chiqamiz. Biz massivning har bir elementini oodlify () funksiyasi bilan qayta ishlamoqchimiz va uni yangi massivga joylashtirmoqchimiz. O'z-o'zidan, massiv elementlariga kirish uchun ishlatiladigan hisoblagich bizni qiziqtirmaydi.

Har bir element bilan muayyan harakatlarni bajarishni o'z ichiga olgan massivlar bilan ishlash uchun shunga o'xshash naqsh juda keng tarqalgan. Natijada, ES2015 hisoblagichni unutishga imkon beruvchi yangi halqa konstruktsiyasini taqdim etadi. Bu tsiklning for… hisoblanadi. Bunday tsiklning har bir iteratsiyasida massivning keyingi elementi taqdim etiladi. Bu shunday ko'rinadi:

Chiqish =; uchun (kirish elementiga ruxsat bering) (yo'l yangiItem = oodlify (element); output.push (newItem);)
Kod ancha toza ko'rinadi. E'tibor bering, bu erda hisoblagich yoki taqqoslash operatsiyasi yo'q. Ushbu yondashuv bilan siz hatto indeks bo'yicha massivning muayyan elementiga murojaat qilishingiz shart emas. For… of loop barcha yordamchi operatsiyalarni bajaradi.

Agar biz massivlar bilan qanday ishlashni o‘rganishni bu yerda yakunlasak va hamma joyda for tsikllari o‘rniga for… sikllaridan foydalansak, bu kodni soddalashtirish tufayli oldinga yaxshi qadam bo‘ladi. Lekin... biz oldinga borishimiz mumkin.

Massivlarni o'zgartirish

For… sikli for tsikliga qaraganda ancha toza ko'rinadi, lekin kodda ko'plab yordamchi elementlar ham mavjud. Shunday qilib, siz chiqish massivini ishga tushirishingiz va tsiklning har bir iteratsiyasida push () usulini chaqirishingiz kerak. Kodni yanada ixcham va ifodali qilish mumkin, ammo buni amalga oshirishdan oldin, keling, demo vazifasini biroz kengaytiraylik. Agar oodlify () funksiyasidan foydalangan holda ikkita massivni qayta ishlash kerak bo'lsa-chi?

Const Flowship = ["frodo", "sam", "gandalf", "aragorn", "boromir", "legolas", "gimli",]; const band = ["Jon", "Pol", "Jorj", "Ringo",];
Aniq yechim ikkita halqadan foydalanish va ulardagi massivlarni qayta ishlashdir:

bandodle =; for (bandning elementi) (let newItem = oodlify (element); bandoodle.push (newItem);) let floodleship =; uchun (do'stlik elementiga ruxsat bering) (yo'l yangiItem = oodlify (element); floodleship.push (yangiItem);)
Juda ishlaydigan variant. Va ishlaydigan kod ishni bajarmaydigan kodga qaraganda ancha yaxshi. Ammo ikkita juda o'xshash kod qismi DRY dasturiy ta'minotini ishlab chiqish bilan juda mos kelmaydi. Takrorlanishlar sonini kamaytirish uchun kodingizni qayta tahrirlashingiz mumkin.

Ushbu g'oyadan so'ng biz quyidagi kabi funktsiyani yaratamiz:

Funktsiya oodlifyArray (kirish) (chiqish = ruxsat berish; uchun (kirish elementi ruxsat) (yo'l newItem = oodlify (element); output.push (newItem);) chiqish chiqish;) let bandoodle = oodlifyArray (band); let floodleship = oodlifyArray (do'stlik);
Bu ancha yaxshi ko'rinadi, lekin biz massiv elementlarini qayta ishlashni xohlaydigan boshqa funksiya bo'lsa-chi?

izzlify (s) funksiyasi (s.replace (/ + / g, "izzle") ni qaytaring)
Endi oodlifyArray () funksiyasi yordam bermaydi. Biroq, agar biz boshqa shunga o'xshash funktsiyani yaratsak, bu safar - izzlufyArray (), biz o'zimizni takrorlaymiz. Qanday bo'lmasin, keling, shunga o'xshash funktsiyani yaratamiz va uni oodlifyArray ():

Funktsiya oodlifyArray (kirish) (chiqish =; uchun (kirish elementi ruxsat) (yo'l newItem = oodlify (element); output.push (newItem);) chiqishni qaytarish;) funksiya izzlifyArray (kirish) (chiqish =; uchun ( kirish elementiga ruxsat bering) (yo'l yangiItem = izzlify (element); output.push (newItem);) chiqishni qaytaring;)
Ikki funktsiya nihoyatda o'xshash. Balki biz ular amal qiladigan namunani umumlashtira olamizmi? Bizning maqsadimiz: “Masiv va funksiya mavjud. Siz yangi massivni olishingiz kerak, bu funktsiyadan foydalangan holda asl massivning har bir elementini qayta ishlash natijalarini o'z ichiga oladi. Massivlarni qayta ishlashning bunday usuli "mapping" yoki "transformation" (ingliz terminologiyasida xaritalash) deb ataladi. Bunday operatsiyalarni bajaradigan funktsiyalar odatda "xarita" deb ataladi. Bunday funktsiyaning bizning versiyamiz quyidagicha ko'rinadi:

Funktsiya xaritasi (f, a) (chiqish =; uchun (a elementi bo'lsin) (output.push (f (element));) chiqishni qaytarish;)
Tsikl endi alohida funktsiya bo'lsa-da, undan butunlay qutulishning iloji bo'lmadi. Agar siz butun yo'lni bosib o'tsangiz va umuman aylanishsiz bajarishga harakat qilsangiz, xuddi shunday rekursiv versiyasini yozishingiz mumkin:

Funktsiya xaritasi (f, a) (agar (a.length === 0) (qaytish;) qaytish .concat (xarita (f, a.slice (1)));)
Rekursiv yechim juda oqlangan ko'rinadi. Faqat bir necha qator kod va minimal chekinish. Ammo algoritmlarning rekursiv ilovalari odatda juda ehtiyotkorlik bilan qo'llaniladi va ular eski brauzerlarda ham yomon ishlaydi. Va, aslida, agar buning uchun yaxshi sabab bo'lmasa, displey operatsiyasini o'zimiz amalga oshirish uchun funktsiyani yozishimiz shart emas. Bizning xarita funksiyamiz shu qadar keng tarqalgan vazifadirki, JavaScript-da o'rnatilgan xarita () usuli mavjud. Agar siz ushbu usuldan foydalansangiz, kod quyidagicha ko'rinadi:

bandoodle = band.map (oodlify); let floodleship = sheriklik.map (oodlify); let bandizzle = band.map (izzlify); let fellowshizzle = sheriklik.map (izzlify);
E'tibor bering, bu erda hech qanday chekinish yoki pastadir yo'q. Albatta, ma'lumotlarni qayta ishlashda JavaScript-ning chuqurligida looplardan foydalanish mumkin, ammo bu endi bizning tashvishimiz emas. Endi kod ham qisqa, ham ifodali. Bundan tashqari, oddiyroq.

Nima uchun bu kod osonroq? Bu ahmoqona savol bo'lib tuyulishi mumkin, lekin o'ylab ko'ring. Qisqa bo'lgani uchun osonroqmi? Yo'q. Kodning ixchamligi oddiylik belgisi emas. Bu oddiyroq, chunki bu yondashuv bilan biz vazifani qismlarga ajratamiz. Ya'ni, satrlarda ishlaydigan ikkita funktsiya mavjud: oodlify va izzlify. Bu funksiyalar massivlar yoki tsikllar haqida hech narsa bilishi shart emas. Massivlar bilan ishlaydigan yana bir funktsiya mavjud map. Shu bilan birga, massivda qanday turdagi ma'lumotlar mavjudligi yoki biz ushbu ma'lumotlar bilan aynan nima qilishni xohlayotganimiz mutlaqo befarq. U oddiygina massiv elementlarini o'tkazib, unga berilgan har qanday funktsiyani bajaradi. Hamma narsani aralashtirish o'rniga, biz satrlarni qayta ishlash va massivlarni qayta ishlashni ajratdik. Shuning uchun olingan kod oddiyroq.

Katlanuvchi massivlar

Shunday qilib, xarita funktsiyasi juda foydali, lekin u tsikllardan foydalanadigan barcha massivni qayta ishlash variantlarini qamrab olmaydi. Muayyan massivga asoslanib, siz bir xil uzunlikdagi yangisini yaratishingiz kerak bo'lgan hollarda yaxshi. Ammo, masalan, raqamli massivning barcha elementlarini qo'shish kerak bo'lsa-chi? Yoki ro'yxatdagi eng qisqa qatorni topmoqchi bo'lsangiz? Ba'zan siz massivni qayta ishlashingiz va aslida uning asosida yagona qiymat hosil qilishingiz kerak.

Keling, bir misolni ko'rib chiqaylik. Aytaylik, sizda har biri super qahramonni ifodalovchi ob'ektlar ro'yxati bor:

Qahramonlar = [(ism: "Hulk", kuch: 90000), (nomi: "O'rgimchak odam", kuch: 25000), (ism: "Hawk Eye", kuch: 136), (ism: "Thor", kuch: 100000), (nomi: "Qora beva", kuch: 136), (nomi: "Vision", kuch: 5000), (nomi: "Scarlet Witch", kuch: 60), (nomi: "Mystique", quvvat: 120), (nomi: "Namora", quvvati: 75000),];
Biz eng kuchli qahramonni topishimiz kerak. Buning uchun siz for ... of loop dan foydalanishingiz mumkin:

Eng kuchli bo'lsin = (kuch: 0); uchun (qahramonlar qahramoni bo'lsin) (agar (qahramon.kuch> eng kuchli.kuch) (eng kuchli = qahramon;))
Hamma narsani hisobga olsak, bu kod unchalik yomon emas. Biz massivni aylanib chiqamiz, tomosha qilingan qahramonlarning eng kuchlisi ob'ektini eng kuchli o'zgaruvchida saqlaymiz. Massiv bilan ishlash naqshini aniqroq ko'rish uchun, tasavvur qilaylik, biz hali ham barcha qahramonlarning umumiy kuchini aniqlashimiz kerak.

CombinedStrength = 0 bo'lsin; uchun (qahramonlar qahramoni bo'lsin) (combinedStrength + = hero.strength;)
Ushbu ikkita misolning har birida tsiklni boshlashdan oldin ishga tushirilgan ishga tushirish o'zgaruvchisi mavjud. Keyin, har bir iteratsiyada massivning bir elementi qayta ishlanadi va o'zgaruvchi yangilanadi. Ish sxemasini yanada yaxshiroq ajratib ko'rsatish uchun biz tsikllar ichida bajarilgan amallarni funktsiyalarga o'tkazamiz va bajarilgan harakatlarning o'xshashligini ta'kidlash uchun o'zgaruvchilar nomini o'zgartiramiz.

Function greaterStrength (chempion, da'vogar) (qaytish (da'vogar.kuch> chempion.kuch)? Da'vogar: chempion;) funktsiya addStrength (hisoblash, qahramon) (qaytish tally + qahramon.kuch;) const initialStrongest = (kuch: 0); let working = initialStrongest; for (qahramonlar qahramoni) (working = greaterStrength (ishchi, qahramon);) const strongest = working; const initialCombinedStrength = 0; ish = initialCombinedStrength; uchun (qahramonlar qahramoni) (ishchi = addStrength (ishchi, qahramon);) const combinedStrength = ish;
Agar hamma narsa yuqorida ko'rsatilganidek qayta yozilsa, ikkita pastadir juda o'xshash. Ularni ajratib turadigan yagona narsa bu ular chaqiradigan funktsiyalar va o'zgaruvchilarning boshlang'ich qiymatlari. Ikkala tsiklda massiv bitta qiymatga yopiladi. Ingliz terminologiyasida bu operatsiya "reducing" deb ataladi. Shunday qilib, biz kashf etgan naqshni amalga oshiradigan kamaytirish funksiyasini yarataylik.

Funktsiyani qisqartirish (f, initialVal, a) (ixtiyoriy ish = initialVal; uchun (a elementi bo'lsin) (ishchi = f (ishchi, element);) ishlashga qaytish;)
Shuni ta'kidlash kerakki, xarita funksiyasi shablonida bo'lgani kabi, qisqartirish funksiyasi shabloni shunchalik keng tarqalganki, JavaScript uni o'rnatilgan massiv usuli sifatida taqdim etadi. Shuning uchun, agar buning uchun maxsus sabab bo'lmasa, o'zingizning usulingizni yozishingiz shart emas. Standart usuldan foydalanib, kod quyidagicha ko'rinadi:

Const strongestHero = heroes.reduce (kattaroq kuch, (kuch: 0)); const combinedStrength = heroes.reduce (addStrength, 0);
Agar siz yakuniy natijaga diqqat bilan qarasangiz, natijada olingan kod avvalgisidan ancha qisqa emasligini, tejash juda kichik ekanligini topasiz. Agar biz o'z kamaytirish funksiyamizdan foydalanganimizda, umumiy kod kattaroq bo'lar edi. Biroq, bizning maqsadimiz qisqa kod yozish emas, balki murakkablikni kamaytirishdir. Shunday qilib, biz dasturning murakkabligini kamaytirdikmi? Aytishim mumkinki, ular buni qisqartirishdi. Biz sikl kodini massiv elementlarini qayta ishlovchi koddan ajratdik. Natijada dasturning alohida bo‘limlari mustaqil bo‘ldi. Kod oddiyroq.

Bir qarashda qisqartirish funktsiyasi ancha sodda ko'rinishi mumkin. Ushbu funktsiyadan foydalanish holatlarining aksariyati raqamli massivlarning barcha elementlarini qo'shish kabi oddiy narsalarni namoyish etadi. Biroq, hech bir joyda reduktor tomonidan qaytarilgan qiymat ibtidoiy tip bo'lishi kerakligi aytilmagan. Bu ob'ekt yoki hatto boshqa massiv bo'lishi mumkin. Men buni birinchi marta tushunganimda, bu meni hayratda qoldirdi. Siz, masalan, kamaytirish yordamida massivni xaritalash yoki filtrlash amaliyotini amalga oshirishingiz mumkin. Men buni o'zingiz sinab ko'rishingizni maslahat beraman.

Massivlarni filtrlash

Demak, massivning har bir elementi ustida amallarni bajarish uchun xarita funksiyasi mavjud. Massivni bitta qiymatga siqish imkonini beruvchi kamaytirish funksiyasi mavjud. Agar massivdan faqat uning ayrim elementlarini ajratib olishingiz kerak bo'lsa-chi? Ushbu g'oyani o'rganish uchun keling, super qahramonlar ro'yxatini kengaytiramiz, u erga qo'shimcha ma'lumotlarni qo'shamiz:

Qahramonlar = [(ism: "Xulk", kuch: 90000, jinsi: "m"), (ismi: "O'rgimchak odam", kuch: 25000, jinsi: "m"), (ismi: "Hawk Eye", kuch: 136, jinsi: "m"), (ismi: "Thor", kuch: 100000, jinsi: "m"), (ismi: "Qora beva", kuch: 136, jinsi: "f"), (ismi: : "Vision", kuch: 5000, jinsi: "m"), (ism: "Skarlet jodugar", kuch: 60, jins: "f"), (ism: "Mystique", kuch: 120, jinsi: "f" "), (nomi:" Namora ", quvvati: 75000, jinsi:" f "),];
Aytaylik, sizda ikkita vazifa bor:

  1. Barcha ayol qahramonlarni toping.
  2. Kuchlari 500 dan oshadigan barcha qahramonlarni toping.
Bu vazifalarni hal qilishda yaxshi eski for ... of loop yordamida yondashish juda mumkin:

ayol qahramonlari =; uchun (qahramonlar qahramoni bo'lsin) (agar (hero.sex === "f") (femaleHeroes.push (qahramon);)) superinsanlar bo'lsin =; uchun (qahramonlar qahramoni bo'lsin) (agar (qahramon.strength> = 500) (superhumans.push (qahramon);))
Umuman olganda, bu juda munosib ko'rinadi. Ammo bu erda, yalang'och ko'z bilan, takrorlanuvchi naqsh ko'rinadi. Aslida, looplar aynan bir xil, ular faqat if bloklarida farqlanadi. Agar biz ushbu bloklarni funktsiyalarga o'tkazsak nima bo'ladi?

Function isFemaleHero (qahramon) (qaytish (hero.sex === "f");) funksiyasiSuperhuman (qahramon) (qaytish (hero.strength> = 500);) ayol qahramonlar =; uchun (qahramonlar qahramoni bo'lsin) (agar (isFemaleHero (qahramon)) (femaleHeroes.push (qahramon);)) superinsanlar bo'lsin =; uchun (qahramonlar qahramoni bo'lsin) (agar (Superinson (qahramon) bo'lsa) (superhumans.push (qahramon);))
Faqat rost yoki yolgʻonni qaytaruvchi funksiyalar baʼzan predikatlar deb ataladi. Biz qahramonlar massividan keyingi qiymatni yangi massivda saqlash yoki saqlashni hal qilish uchun predikatdan foydalanamiz.

Kodni qayta yozish usuli uni uzoqroq qildi. Ammo, predikat funktsiyalarini ta'kidlagandan so'ng, dasturning takrorlanuvchi bo'limlarini ko'rish yaxshiroq bo'ldi. Keling, ushbu takrorlashlardan xalos bo'lish uchun funktsiya yarataylik:

Funksiya filtri (predikat, arr) (ishlash imkonini bering =; uchun (arr elementi bo'lsin) (if (predikat (element))) (ishchi = working.concat (element);)) qaytish ishlaydi;) const femaleHeroes = filter (isFemaleHero, qahramonlar); const superhumans = filter (isSuperhuman, qahramonlar);
Bu erda, o'rnatilgan xarita va qisqartirish funktsiyalarida bo'lgani kabi, JavaScript-da biz bu erda Array ob'ektining standart filtrlash usulida yozgan narsamiz mavjud. Shuning uchun, agar aniq kerak bo'lmasa, o'z funktsiyangizni yozishingiz shart emas. Foydalanish standart vositalar kod shunday ko'rinadi:

Const femaleHeroes = heroes.filter (isFemaleHero); const superhumans = qahramonlar.filtr (isSuperhuman);
Nima uchun bu yondashuv loopning for… dan foydalanishdan ko'ra yaxshiroq? Buni amalda qanday ishlatishingiz haqida o'ylab ko'ring. Bizda quyidagi shakldagi vazifa bor: "Barcha qahramonlarni toping ...". Muammoni standart filtr funksiyasi yordamida hal qilish mumkinligi aniqlansa, ish osonlashadi. Biz qilishimiz kerak bo'lgan narsa bu funktsiya bizni qaysi elementlarga qiziqtirayotganini aytishdir. Bu bitta ixcham funktsiyani yozish orqali amalga oshiriladi. Massivlar yoki qo'shimcha o'zgaruvchilar bilan ishlash haqida tashvishlanishingiz shart emas. Buning o'rniga biz kichik predikat funksiyasini yozamiz va muammo tugadi.

Massivlar bilan ishlaydigan boshqa funktsiyalarda bo'lgani kabi, filtrdan foydalanish ko'proq ma'lumotni kamroq kodda ifodalash imkonini beradi. Biz aniq nimani filtrlayotganimizni tushunish uchun barcha standart tsikl kodini o'qish shart emas. Buning o'rniga, siz tushunishingiz kerak bo'lgan hamma narsa to'g'ridan-to'g'ri usul chaqirilganda tasvirlangan.

Massivlarni qidirish

Filtrlash juda foydali operatsiya. Ammo ro'yxatda faqat bitta super qahramon topilsa-chi? Aytaylik, bizni “Qora beva” qiziqtiradi. Ushbu muammoni hal qilish uchun filtr funktsiyasidan foydalanish mumkin:

Funktsiya isBlackWidow (qahramon) (qaytish (hero.name === "Black Widow");) const blackWidow = heroes.filter (isBlackWidow);
Bu erda asosiy muammo shundaki, bunday yechim samarasiz. Filtrlash usuli massivdagi har bir element bo'ylab o'tadi. Biroq, ma'lumki, massivda faqat bitta qahramon Qora beva ayol deb nomlangan, ya'ni bu qahramon topilgandan keyin siz to'xtashingiz mumkin. Shu bilan birga, predikat funktsiyalaridan foydalanish qulay. Shunday qilib, keling, birinchi mos elementni topadigan va qaytaradigan find funktsiyasini yozamiz:

Funktsiya find (predikat, arr) (uchun (arr elementi bo'lsin) (if (predikat (element))) (elementni qaytarish;))) const blackWidow = find (isBlackWidow, qahramonlar);
Bu erda yana shuni aytishim kerakki, JavaScript-da kerakli narsani bajaradigan o'rnatilgan funksiya mavjud:

Const blackWidow = heroes.find (isBlackWidow);
Natijada avvalgidek fikrimizni lo‘ndaroq ifodalashga muvaffaq bo‘ldik. O'rnatilgan find funktsiyasidan foydalanib, ma'lum bir elementni topish vazifasi bitta savolga qisqartiriladi: "Kerakli element topilganligini qanday mezonlar yordamida aniqlash mumkin?" Tafsilotlar haqida tashvishlanishga hojat yo'q.

Kamaytirish va filtrlash funksiyalari haqida

O'quvchilar kamaytirish va filtrlash funktsiyalari uchun yuqoridagi misollardagi qahramonlar orqali ikki marta takrorlash samarasiz ekanligini payqashdi. ES2015 dan tarqalish operatoridan foydalanish massivni bittaga katlamada ishlatiladigan ikkita funksiyani qulay tarzda birlashtirish imkonini beradi. Bu yerda bir marta massiv bo‘ylab aylanish imkonini beruvchi o‘zgartirilgan kod parchasi:

Funksiya jarayoniStrength ((eng kuchli Qahramon, birlashtirilganStrength), qahramon) (qaytish (eng kuchli Qahramon: greaterStrength (eng kuchli Qahramon, qahramon), combinedStrength: addStrength (combinedStrength, qahramon),);) const (eng kuchli Qahramon, combinedStrength) = (eng kuchli Qahramon, combinedStrength) (eng kuchli.Herocess, theroes. : (kuch: 0), birlashtirilganKuch: 0));
Bu versiya massiv ikki marta bosib o‘tilgan versiyadan biroz murakkabroq bo‘lishini e’tibordan chetda qoldira olmayman, lekin massiv juda katta bo‘lsa, undan o‘tishlar sonini kamaytirish juda foydali bo‘lishi mumkin. Har holda, algoritmning murakkablik tartibi O (n) bo'lib qoladi.

Natijalar

O'ylaymanki, bu erda keltirilgan funktsiyalar o'ylangan holda tanlangan abstraktsiyalar nima uchun foydali va kodda yaxshi ko'rinishining ajoyib namunasidir. Aytaylik, biz imkon qadar o'rnatilgan funksiyalardan foydalanamiz. Har bir holatda, natija quyidagicha bo'ladi:
  1. Biz looplardan xalos bo'lamiz, bu kodni yanada ixcham va o'qishni osonlashtiradi.
  2. Amaldagi shablon mos standart usul nomi yordamida tasvirlangan. Ya'ni xaritalash, qisqartirish, filtrlash yoki topish.
  3. Vazifaning ko'lami kamayadi. Massivni qayta ishlash uchun kodni o'zingiz yozish o'rniga, standart funktsiyaga massiv bilan nima qilish kerakligini aytishingiz kerak.
E'tibor bering, har bir holatda muammoni hal qilish uchun ixcham sof funktsiyalar qo'llaniladi.

Aslida, bularning barchasi haqida o'ylab ko'rsangiz, birinchi daqiqada hayratlanarli ko'rinadigan xulosaga kelishingiz mumkin. Ma'lum bo'lishicha, agar siz massivlarni qayta ishlash uchun faqat yuqorida tavsiflangan to'rtta naqshdan foydalansangiz, JS kodidan deyarli barcha tsikllarni olib tashlashingiz mumkin. Axir, JavaScript-da yozilgan deyarli har bir tsiklda nima qilinadi? U massivni qayta ishlaydi yoki tuzadi yoki ikkalasini ham bajaradi. Bundan tashqari, JS massivlar bilan ishlash uchun boshqa standart funktsiyalarga ega, ularni o'zingiz osongina o'rganishingiz mumkin. Looplardan xalos bo'lish deyarli har doim dasturlarning murakkabligini kamaytirish va o'qish va saqlash uchun qulayroq kod yozish imkonini beradi.

Hurmatli JavaScript ishlab chiquvchilari, sizda har qanday keng tarqalgan "o'z-o'zidan yozilgan" konstruktsiyalardan xalos bo'lish orqali kodingizni yaxshilashga imkon beradigan biron bir standart funksiya bormi?

Teglar: teglar qo'shish

For tsikli JavaScript-da tsiklning eng ko'p qo'llaniladigan shaklidir.

Uning tuzilishi quyidagicha ko'rinadi:

Uchun (boshlash; shart; qadam) (/ * halqa tanasi * /)

Bu juda oddiy. Keling, bir misolni ko'rib chiqaylik:

Var i; uchun (i = 1; i

Ushbu misolda:

  • Tsikl boshlanishi: i = 1 (i = 1 dan boshlab)
  • Cicning holati: i
  • Velosiped bosqichi: i ++ (ko'chadan har bir qadamda i ni 1 ga oshiring)
  • Loop tanasi: document.write ("

    Tsiklning qadam raqami bajariladi: "+"

    "); (xabarni ko'rsatish)

Bu for loopni bajarish uchun bosqichma-bosqich algoritm, batafsilroq:

  1. Loop start: i o'zgaruvchisiga 1-qiymat beriladi. siklning bu qismi bir marta bajariladi.
  2. Loop sharti (i 5) tekshiriladi - tsiklning oxiri.
  3. Loopning tanasi bajariladi.
  4. Tsikl bosqichi davom etmoqda. Bizning holatda, i ++. U har doim tsiklning tanasidan keyin bajariladi.
  5. 2-bandga qaytish.

Agar pastadir tanasi bitta bayonotdan iborat bo'lsa, u holda jingalak qavslar {...} qo'yish shart emas.

i o'zgaruvchisi tsikl tugagandan keyin yo'qolmaydi. U mavjud bo'lishda davom etadi va tsikl tugagandan so'ng uning qiymati 6 ga teng bo'ladi.

Keling, ushbu ma'lumotlarni yangi misolda umumlashtiramiz:

Var i; uchun (i = 1; i

Bu erda pastadir tanasini yaratish uchun jingalak qavslar ishlatilmadi.

Qavslar {...} JavaScript-da blok yaratish til konstruksiyalaridan biridir. Ya'ni, agar for loop bayonotidan keyin jingalak qavslar mavjud bo'lsa, bu JavaScript mexanizmi butun JavaScript blokini bajarishi kerakligini anglatadi.

Blokka o'xshab, funktsiyani for tsiklida ko'rsatish mumkin. Mana bir misol:

Uchun (var i = 1; i

Ammo funktsiyani e'lon qilishda jingalak qavslar {...} talab qilinadi. Ularning yo'qligi xatoga olib keladi.

E'tibor bering, bu siklda i o'zgaruvchisi sikl boshida e'lon qilinadi: for ( var i = 1; i

uchun qismlarni o'tkazib yuborish

Umuman olganda, tsiklning boshlanishini o'tkazib yuborish mumkin:

Var i = 1; uchun (; ya'ni

Ko'ryapsizmi, tsikl boshida faqat nuqta-vergul bor va tsikl yaxshi ishlaydi.

Bundan tashqari, qadamni olib tashlashingiz mumkin:

Var i = 1; uchun (; ya'ni

Bu for loop while ning analogiga aylandi (ya'ni

Siz ifodani o'zgaruvchini o'zgartiradigan shartga qo'yishingiz mumkin.

(i = 10; i--;) uchun (document.write ("

Tsikl bosqichi bajariladi: "+ i +".

"); }

JavaScript tarjimoni mantiqiy qiymat olishni kutganligi sababli, har qanday qiymat kelib chiqadi boolean turi, keyin keyingi pasayish natijasida i o'zgaruvchisi 0 ga teng bo'lganda (noto'g'ri), tsikl to'xtaydi.

Cheksiz for loop

Ha, ha, men cheksiz yozishni to'g'ri deb bilaman :)

Demak, shart har doim to'g'ri bo'lsa, tsikl cheksiz bo'ladi. Mana bir misol:

Uchun (var i = 1; i

Ushbu misolda i o'zgaruvchisi kamayadi va hech qachon beshdan oshmaydi. Loop abadiy davom etadi. Ushbu skriptni ishga tushirishga harakat qiling. Mening Chrome "o'ylanib qoldi" va ekranda hech narsa ko'rsatmadi, lekin o'ylash va o'ylashda davom etdi.

Tasodifan cheksiz ko'chadan yaratmaslik uchun ehtiyot bo'ling.

For tsiklini uzish

For tsiklini to'xtatish uchun, xuddi boshqa har qanday tsiklni to'xtatish kabi, break buyrug'idan foydalaning. JavaScript ishlov beruvchisi siklning tanasida uzilish bayonotini aniqlaganida, u sikl bajarilishini to'xtatadi va tsikldan keyingi skriptlarni bajarishni boshlaydi. agar mavjud bo'lsa.

Quyidagi misolda biz tsiklni uchinchi iteratsiyada (uchinchi qadam) to'xtatamiz.

Uchun (var i = 1; i

Keling, misolni biroz murakkablashtiramiz

Cheksiz tsiklning atigi 100 ta takrorini bajaramiz.

Var $ hisoblagich = 1; uchun (var i = 1; i

Keyingi takrorlash: davom eting

Davom etish buyrug'i joriy iteratsiyani tugatadi va keyingi iteratsiyani boshlaydi.

Davom etish direktivasi uzilish direktivasining "kichik singlisi" bo'lib, u butun tsiklni emas, balki faqat takrorlashni to'xtatadi.

Uchun (var i = 1; i

Quyidagi tsikl toq qiymatlarni chop etishda davom etadi:

Uchun (var i = 0; i

Albatta, g'alati qiymatlarni davom ettirish direktivasisiz bunday tsikl yordamida chop etish mumkin:

Uchun (var i = 0; i

Tanaffus/davom etish direktivalari "?"

Savol belgisi operatoriga qisqacha ta'rif beraylik "?" Bu if iborasiga o'xshaydi.

Mantiqiy qurilish:

Agar (shart) (a ();) boshqacha (b ();)

"?" Operatoridagi kod bilan bir xil ishlaydi.

Vaziyat? a (): b (); var i = 2; document.write ("

1-qism.

"); agar (i == 2) document.write ("

Shart ishladi.

"); else document.write ("

Shart ish bermadi.

"); document.write ("

2-qism.

"); i == 2? document.write ("

Shart ishladi.

"): document.write ("

Shart ish bermadi.

");

Shunday qilib, muhim, siz "?" ning o'ng tomonidagi break / davom dan foydalana olmaysiz.

JavaScript-da "?" Operatorida qiymatlarni qaytarmaydigan sintaktik konstruktsiyalarga ruxsat berilmaydi.

Quyidagi misol ishlamayapti, unda xatolik bor:

Uchun (var i = 0; i

Tanaffus / davom etish uchun teglar

Ba'zan ichki o'ralgan halqalarni yaratish kerak bo'ladi. Bunday holda, ichki halqa ishlayotganda, asosiy tsiklni to'xtatish yoki asosiy tsiklni takrorlashni to'xtatish kerak bo'lishi mumkin. Buning uchun teglar ishlatiladi.

Looplarni belgilash uchun teglardan foydalanishingiz mumkin, shunda siz uzilish yoki davom etish bilan tsikldan chiqishingiz yoki tsiklni yangi iteratsiya bilan davom ettirishingiz mumkin.

Yorliqlar tanaffus va davom buyruqlarining tashqi tsiklning bajarilishiga ta'sir qilishning yagona yo'lidir.

Yorliq ko'rsatmasi faqat uzilish yoki tsikldan chiqishni davom ettirish bilan birgalikda ishlatiladi.

Tegda "name:" sintaksisi mavjud, teg nomi noyob bo'lishi kerak. Yorliq sikldan oldin, xuddi shu qatorda yoki chiziqli tanaffus bilan joylashtiriladi.

Xuddi shunday, siz bu joyda break direktivasidan foydalanishingiz mumkin. Ammo agar siz uni ishlatsangiz, tushunganingizdek, looplarning bajarilishi to'xtaydi.

Var i, j; metka1: uchun (i = 0; i

JavaScript-da goto bayonoti mavjud emas, PHP-da bo'lgani kabi, faqat break yoki davomli teglardan foydalanish mumkin.

Yorliqlar JavaScript dasturlashda kamdan-kam qo'llaniladi, chunki ular kodni o'qish va tushunishni qiyinlashtiradi deb o'ylashadi. Kodlashda funksiyalardan foydalanish tavsiya etiladi.

Velosipedlar ma'lum bir kod qismini ketma-ket bir necha marta bajarish uchun ishlatiladi.

Nima uchun kerak- Tasavvur qiling, massivning 100 ta elementini kvadratga aylantirishingiz kerak. Agar siz har bir elementga alohida kaliti orqali kirsangiz, u 100 qator kod oladi va bu kodni yozish uchun siz ko'p vaqt sarflashingiz kerak bo'ladi.

Lekin bu shart emas - bizda JavaScript-ni biz uchun ba'zi operatsiyalarni bajarish imkoniyati mavjud. kerakli miqdordagi marta... Masalan, massivning barcha elementlarini kvadratga aylantiring.

Bu yordamida amalga oshiriladi sikllar.

while tsikli

Velosiped esa gacha davom etadi to'g'ri(to'g'ri) parametr tomonidan o'tkazilgan ifoda. Sintaksisga qarang:

While (ifoda rost bo'lsa) (bu kodni tsiklda bajaring; har bir sikl boshida, qavs ichidagi ifodani tekshiring) / * Ifoda haqiqiy bo'lishni to'xtatganda, tsikl tugaydi. Agar dastlab yolg'on bo'lsa, u hech qachon bajarilmaydi! * /

Asosan, halqa esa bajarilishi mumkin cheksiz(lekin bu skriptni osib qo'yishiga olib keladi!), Siz shunchaki unga shunday ifodani berishingiz kerak hech qachon yolg'on bo'lmaydi... Masalan, bu kabi:

Vaqt siklidan foydalanib, birdan beshgacha raqamlarni ketma-ket chop qilaylik:

Var i = 0; // aylanish hisoblagichi while (i< 5) { /* С помощью оператора ++ увеличиваем i на единицу при каждом проходе цикла. */ i++; alert(i); }

O'zgaruvchiga e'tibor bering i- u atalmish tsikl hisoblagichi... Hisoblagichlar tsiklning necha marta ishlaganligini hisobga olish uchun ishlatiladi. Bundan tashqari, ular yordamchi rol o'ynaydi - bizning vazifamizda biz 1 dan 5 gacha raqamlarni ko'rsatish uchun hisoblagichdan foydalandik.

Hisoblagichlar uchun harflardan foydalanish odatiy holdir. i, j va k.

Loop uchun

Velosiped uchun hisoblanadi while ga muqobil... Buni tushunish qiyinroq, lekin ko'pincha u kamroq satrlarni egallaganidan ko'ra ko'proq seviladi.

For (dastlabki buyruqlar; sikl oxiri sharti; tsiklni bosib o'tgandan keyingi buyruqlar) (loop tanasi)

Dastlabki buyruqlar tsikl boshlanishidan oldin bajariladigan narsadir. Ular faqat bir marta qatl qilinadi. Odatda, hisoblagichlarning boshlang'ich qiymatlari u erda joylashtiriladi, masalan: i = 0.

Tsiklning oxiri holati - bu haqiqat ekan, tsikl ishlaydi, masalan: i.

Ko'chadan keyin buyruqlar- bular sikl har gal tugashi bilan bajariladigan buyruqlardir. Odatda u erda hisoblagichlar ko'payadi, masalan: men ++.

Keling, halqadan foydalanamiz uchun 0 dan 9 gacha raqamlarni ketma-ket ko'rsatamiz:

/ * siklning boshida i nolga teng bo'ladi, sikl i bo'lganda bajariladi.< 10, после каждого прохода к i прибавляется единица: */ for (var i = 0; i < 10; i++) { alert(i); //выведет 0, 1, 2... 9 }

Tanasiz halqa

Looplarda jingalak qavslarni o'tkazib yuborish mumkin - bu holda, pastadir uning ostida faqat bitta qatorni bajaradi (men buni qilishni tavsiya etmayman, bu ko'pincha xatolarga olib keladi):

Uchun (var i = 0; i< 10; i++) //<--- точки с запятой нет alert(i); //выведет 0, 1, 2... 9

Ammo keyin bo'lsa ) nuqta-vergul qo'ying - pastadir yopiladi va keyingi qator unga kirmaydi, siz tanasiz deb ataladigan pastadir olasiz, bu bizning holatlarimizda shunchaki aylantiriladi va natijada o'zgaruvchining qiymatini o'zgartiradi. i:

Uchun (var i = 0; i< 10; i++); //<--- точка с запятой есть alert(i); //выведет 9

Bunday halqa ba'zan ishlatiladi, siz vazifalarni halqalarga ajratishda undan foydalanish misollarini ko'rasiz.

For tsiklida bir nechta buyruqlar

Qavslar ichida bir nechta buyruqlarni bajarish kerak bo'lsa, ularni vergul bilan ajratamiz:

Uchun (var i = 0, j = 2; i

Keling, yuqoridagi siklni ko'rib chiqaylik: tsikl o'tishdan oldin ikkita buyruq bajariladi: var i = 0, j = 2(esda tutingki, var bu erda bir marta yoziladi) va har bir iteratsiyadan keyin - uchtagacha: i ++, j ++, i = i + j.

Ushbu misol dasturlash nuqtai nazaridan unchalik foydali emas, shunchaki sxematik tarzda buni amalga oshirish mumkinligini ko'rsatadi. Buni unutmang, kelajakda bu sizga foydali bo'ladi.

Massivlar uchun sikl

Loopdan foydalanish uchun massiv elementlarini ketma-ket takrorlashingiz mumkin. Bu quyidagicha amalga oshiriladi:

<= arr.length-1; i++) { alert(arr[i]); //выведет 1, 2, 3, 4, 5 }

Asosiy nuqta shundaki, biz noldan massiv uzunligi minus 1gacha takrorlaymiz (chunki massivning oxirgi elementi soni uning uzunligidan bittaga kam).

Birlikni ayirish kerak emas, balki joy <= qil < :

Var arr =; uchun (var i = 0; i< arr.length; i++) { alert(arr[i]); //выведет 1, 2, 3, 4, 5 }

For-in tsikli

Ob'ektni takrorlash uchun tsikl deb ataladigan narsa ishlatiladi uchun... Keling, bu qanday ishlashini ko'rib chiqaylik.

Keling, shunday ob'ektga ega bo'lamiz:

Var obj = (Kolya: 200, Vasya: 300, Petya: 400);

Keling, uning kalitlarini chiqaraylik. Buning uchun biz quyidagi konstruktsiyadan foydalanamiz: uchun (objdagi kalit), qayerda obj biz takrorlayotgan ob'ekt va kalit- bu ob'ektning kalitlari ketma-ket joylashtiriladigan o'zgaruvchidir (uning nomi siz o'ylagan narsa bo'lishi mumkin - shunday bo'ladi).

Ya'ni, bu tsiklda siz tugatish shartini belgilashingiz shart emas - u ob'ekt tugmachalari tugaguniga qadar takrorlanadi.

Shunday qilib, biz ob'ektning barcha kalitlarini shunday ko'rsatamiz (o'z navbatida):

Var obj = (Kolya: 200, Vasya: 300, Petya: 400); for (objdagi kalit) (ogohlantirish (kalit); // "Kolya", "Vasya", "Petya" ko'rsatiladi)

Agar bizga kalitlar emas, balki qiymatlar kerak bo'lsa, biz ob'ektimizga kalit bo'yicha murojaat qilishimiz kerak, masalan: obj.

Bu qanday ishlaydi: o'zgaruvchida kalit birinchi navbatda "Kolya" bo'ladi, ya'ni obj bu holda bu muhim emas obj ["Kolya"], o'zgaruvchidagi tsiklning keyingi o'tish joyida kalit"Vasya" va boshqalar bo'ladi.

Shunday qilib, ob'ektning barcha elementlarini ko'rsatamiz:

Var obj = (Kolya: 200, Vasya: 300, Petya: 400); for (objdagi kalit) (ogohlantirish (obj); // 200, 300, 400 ni ko'rsatadi)

Tanaffus bayonoti

Ba'zan biz siklning bajarilishini muddatidan oldin to'xtatib qo'yishimiz kerak, agar for tsikli bo'lsa, bu sikl massivning barcha elementlarini takrorlashdan oldin degan ma'noni anglatadi.

Bu nima uchun kerak bo'lishi mumkin? Masalan, oldimizga massivning elementlarini 3 raqami duch kelgunga qadar ko'rsatish vazifasi turibdi.U uchrashishi bilanoq sikl o'z ishini yakunlashi kerak.

Buni ko'rsatmalar yordamida amalga oshirish mumkin tanaffus- agar tsiklning bajarilishi unga etib borsa, tsikl o'z ishini tugatadi.

Keling, yuqoridagi muammoni hal qilaylik - biz 3 raqamiga duch kelganimizdan so'ng, halqani buzamiz:

Var arr =; uchun (var i = 0; i< arr.length; i++) { if (arr[i] === 3) { break; //выходим из цикла } else { alert(arr[i]); } }

Davom etish bayonoti

Bundan tashqari, ko'rsatma mavjud davom eting, unga erishilgandan so'ng, tsikl yangi iteratsiyani boshlaydi. Ba'zan bu kodni soddalashtirish uchun foydali bo'lishi mumkin, garchi deyarli har doim muammoni usiz hal qilish mumkin.

Keyinchalik nima qilish kerak:

Muammolarni hal qilishni quyidagi havoladan boshlang: dars uchun vazifalar.

Hamma narsaga qaror qilganingizdan so'ng, yangi mavzuni o'rganishga o'ting.

Ko'pincha dasturning ma'lum bir qismi ko'p marta bajarilishi kerak. Albatta, siz buni shunchaki qilishingiz mumkin: nusxa ko'chirish-joylashtirish va shunga o'xshash kerakli miqdordagi. Biroq, bu bema'nilikdir, ayniqsa harakatni, masalan, 1000 marta bajarish kerak bo'lsa. Shuning uchun, deb atalmish bor sikllar ko'pchilik dasturlash tillarida mavjud. Va men sizga ular haqida aytib beraman.

Bir necha marta aylantiriladigan maxsus kodni o'z ichiga oladi. Bir necha turdagi tsikllar mavjud: uchun, esa va do-while.

Birinchi tsikldan boshlaylik (va eng mashhur) - loop uchun... Ushbu tsiklning umumiy ko'rinishi quyidagicha:

Uchun (iteratsiya_o'zgaruvchisi = boshlang'ich_qiymat; shart; har bir_iteratsiyadan_keyin) (
// dastur kodi
}

Keling, bu erda nima yozilganiga izoh beraylik. Birinchi bor - iteratsiya o'zgaruvchisi... Bu takrorlanadigan o'zgaruvchining umumiy nomi. Yana davom etadi boshlang'ich_qiymat... Aslida, ism o'zi uchun gapiradi. Keyin bir shart borki, u bajarilgandan keyin (ya'ni qaytib keladi). rost) sikl yana bir marta boshlanadi va nihoyat har bir iteratsiyadan keyin bajariladigan harakat. Odatda, bu iteratsiya uchun o'zgaruvchini o'zgartiradi.

Keling, siz bilan oddiy skript yozamiz, unda tsikl takrorlash sonini ko'rsatadi:

uchun (i = 0; i< 100; i++)
document.write (i + "");

Bu erda biz iteratsiya uchun o'zgaruvchini o'rnatdik (deb nomlangan i), qiymat tayinlangan 0 ... Keyin shart tekshiriladi: i< 100 ... Agar u bajarilgan bo'lsa, unda tsiklning bir iteratsiyasi bajariladi. Har bir iteratsiyani bajargandan so'ng, men ++(ya'ni o'zgaruvchini oshirish i ustida 1 ). Shart yana tekshiriladi va agar u to'g'ri bo'lsa, yana bir iteratsiya amalga oshiriladi. Va shunga o'xshash holatga qadar i< 100 yolg'onga aylanmaydi. Shubhasiz, u faqat 100 ta takrorlashdan keyin yolg'on bo'ladi. Shunday qilib, ushbu tsikl 100 marta bajariladi, biz ushbu skriptni ishga tushirsak, buni ko'rishimiz mumkin. Va yana bir narsa. Bizda faqat bitta operator bajarilganligi sababli ( document.write ()), jingalak qavslar ixtiyoriy. Agar sizda 2 yoki undan ortiq operator tsiklda aylansa, ularni qo'yishingiz kerak.

Endi ikkinchi nav haqida gapiraylik. JavaScript-dagi tsikllar - esa... Asosan, pastadir juda o'xshash uchun(garchi barcha looplar o'xshash bo'lsa ham). Ammo bu erda umumiy nuqtai nazar boshqacha:

Holbuki (shart) (
// dastur kodi
}

Ko'rib turganingizdek, takrorlanadigan o'zgaruvchi ham, iteratsiyadan keyingi harakatlar ham mavjud emas. Demak, xulosa quyidagicha: tsikldan chiqish uchun tsiklning o'zida shunday qilish kerak " holat"yolg'on bo'ldi. Agar bu bajarilmasa, cheksiz tsikl paydo bo'ladi va shuning uchun skriptingiz osib qo'yiladi.

Keling, oldingi kabi bir xil vazifani amalga oshiraylik, lekin foydalanish while tsikli.

Var i = 0;
esa (ya'ni< 100) {
i ++;
document.write (i + "");
}

Loopni boshlashdan oldin biz o'zgaruvchini yaratdik i, boshlang'ich qiymat tayinlangan. Keyin, tsiklni boshlashdan oldin, shart tekshiriladi va agar u to'g'ri bo'lsa, u holda tsiklni takrorlash boshlanadi, unda biz iteratsiya uchun o'zgaruvchini oshiramiz (aks holda, cheksiz tsikl paydo bo'ladi). Va biz bu o'zgaruvchini ko'rsatamiz.

Va nihoyat, oxirgi ko'rinish JavaScript-dagi tsikllar - do-while sikli... Sintaksis bu:

Qilish (
// dastur kodi
) while (shart)

Tsiklga juda o'xshash esa ammo, faqat bitta, lekin juda asosiy farq bor. Agar while tsikli avval shartni tekshiradi, keyin esa takrorlaydi yoki yo'q. Bu do-while sikli u avval takrorlanadi va shundan keyingina vaziyatni tekshiradi. Va agar u noto'g'ri bo'lsa, u holda tsikldan chiqadi. Boshqacha qilib aytadigan bo'lsak, shartdan qat'iy nazar, ushbu tsikl kamida bir marta bajarilishi kafolatlanadi. Menimcha, bu kod ortiqcha bo'ladi, lekin baribir.

Var i = 0;
qilmoq (
i ++;
document.write (i + "");
) esa (i< 100)

Men kodni tushuntirmayman, ishonchim komilki, siz mensiz u bilan shug'ullanasiz. Shuning uchun men ikkita qiziqarli operatorga o'tishni afzal ko'raman: tanaffus va davom eting.

dan boshlaylik tanaffus... Bu operator sikldan muddatidan oldin sakrash imkonini beradi. Keling, siz bilan quyidagi kodni yozamiz:

uchun (i = 0; i< 100; i++) {
agar (i == 50) uzilish;
document.write (i + "");
}

Siz ushbu skriptni ishga tushirishingiz va faqatgina raqamlarni topishingiz mumkin 49 dan beri i = 50 operator tufayli tsikl to'xtatildi tanaffus.

Endi men operator haqida gapiryapman davom eting... Bu operator siklning keyingi iteratsiyasiga o'tish imkonini beradi. Bu erda ko'p narsani tasvirlamaslik uchun darhol sizga misol ko'rsatgan ma'qul:

uchun (i = 0; i< 100; i++) {
agar (i == 50) davom etsa;
document.write (i + "");
}

Agar siz ushbu skriptni ishga tushirsangiz, raqam etarli emasligini ko'rasiz 50 ... Bu sodir bo'ldi, chunki i = 50, biz pastadirning keyingi iteratsiyasiga o'tamiz, undan oldin i tomonidan ortadi 1 va teng bo'ladi 51-chi.

Aftidan, men yozmoqchi bo‘lgan narsa shu edi JavaScript tsikllari... Umid qilamanki, sizga hamma narsa aniq bo'ldi. Shuningdek, siz o'zingiz uchun muammoni o'ylab ko'rishingiz va uni hal qilishingiz mumkin. Bu ajoyib mashq bo'ladi.

Looplar bir xil ko'rsatmalarni qayta-qayta bajarish uchun mo'ljallangan.

JavaScript-da 4 turdagi tsikllar mavjud:

  • Loop uchun. Ushbu tsikl bir xil ko'rsatmalarning aniq takrorlanish soni ma'lum bo'lganda ishlatiladi.
  • while tsikli. U berilgan shart to'g'ri bo'lsa, xuddi shu ko'rsatmalarni bajarish uchun mo'ljallangan.
  • Do ... while tsikli. Bu sikl while sikliga o'xshaydi, lekin shart takrorlanuvchi operatorlarni bajarishdan oldin emas, balki ulardan keyin tekshiriladi. Shunday qilib, while siklidan farqli o'laroq, shart dastlab noto'g'ri bo'lsa ham, operatorlar kamida bir marta bajariladi.
  • ... uchun. Ob'ektdagi barcha xususiyatlarni yoki massivdagi har bir elementni takrorlash kerak bo'lganda foydalaniladi.

Loop uchun

For tsiklining sintaksisi:

For (boshlash; shart; yakuniy ifoda) (/ * halqa tanasi * /)

  • initsializatsiya - sikl bajarilishidan oldin bir marta bajariladigan ifoda; odatda hisoblagichni ishga tushirish uchun ishlatiladi;
  • shart - har bir takrorlashdan oldin haqiqati tekshiriladigan ifoda; agar ifoda rost deb baholansa, u holda takrorlash amalga oshiriladi, aks holda for tsikli chiqadi;
  • yakuniy ifoda har bir takrorlash oxirida bajariladigan ifoda; odatda hisoblagichni o'zgartirish uchun ishlatiladi;
  • pastadir tanasi - takrorlanadigan ko'rsatmalar.

Keling, konsolga 1 dan 9 gacha raqamlarni chop etadigan sikl misolini ko'rib chiqaylik:

Var i; // for tsikli 1 dan 9 gacha, 1 qadam bilan for (i = 1; i<= 9; i++) { console.log(i); }

Ushbu misolda:

  • ishga tushirish: i = 1 (i ni 1 ga belgilash);
  • Loopni tugatish sharti: i<= 9 (значение переменной i не меньше 9);
  • Har bir iteratsiya oxirida bajariladigan ifoda: i ++ (i o'zgaruvchining qiymatini 1 ga oshirish);
  • ko'rsatmalarga rioya qilish: console.log (i) (hisoblagich qiymatini konsolga chop etish).

For tsiklining ixtiyoriy qismlari

In uchun, ishga tushirish bloki ixtiyoriy.

Var i = 1; // for (; i<= 9; i++) { console.log(i); }

For tsiklidagi shart bloki ham ixtiyoriy. Shartsiz, tsikl cheksiz ko'p marta ishlaydi. Bunday holda, uni to'xtatish uchun (sikldan chiqish) siz break operatoridan foydalanishingiz kerak.

Var i; // for (i = 1;; i ++) (if (i> 9) (// tsiklni uzish sharti;) console.log (i);)

Ifoda uchun yakuniy ham ixtiyoriy. Bu holda tsikl hisoblagichi, masalan, tanada o'zgartirilishi mumkin.

Var i; // for uchun sikl (i = 1; i<= 9 ;) { console.log(i); i++; }

Siz 3 ta iborani umuman o'tkazib yuborishingiz mumkin:

Var i = 1; // (;;) uchun sikl (if (i> 9) (break;) console.log (i); i ++;)

Bo'sh ifoda (;) for tsiklining tanasi sifatida ishlatilishi mumkin.

Masalan:

Var arrA =, arrB =; uchun (i = 0; i< arrA.length; arrB[i] = arrA / 2) ; console.log(arrB); //

For foydalanishga misollar

Massiv elementlarini takrorlash uchun for tsiklidan foydalaning:

Var arr =, // massiv i = 0, // counter lenArr = arr.length; // massiv uzunligi (i; i< lenArr; i++) { console.log(arr[i]); }

Tanaffus va davom iboralari

Bundan tashqari, tsikllar tanasi ichida maxsus break va davom iboralaridan foydalanish mumkin.

Break operatori tsiklning bajarilishini tugatish uchun mo'ljallangan. Bular. u joriy sikldan chiqadi va boshqaruvni undan keyingi ko'rsatmaga o'tkazadi.

Davom etish operatori joriy sikl iteratsiyasining bajarilishini to'xtatadi va keyingisiga o'tadi.

Biz konsolda 1 dan 11 gacha bo'lgan toq raqamlarni ko'rsatadigan misol:

Var i; uchun (i = 1; i & lt = 11; i ++) (// agar i o‘zgaruvchisidagi son juft bo‘lsa, keyingi iteratsiyaga o‘ting, agar (i% 2 === 0) (davomi;) // console.log (i);) i o'zgaruvchisining qiymatini chop eting // 1, 3, 5, 7, 9, 11

while old sharti bilan aylanish

while tsikli ba'zi shartlar to'g'ri bo'lsa, xuddi shu ko'rsatmalarni (siklning tanasi) bajaradi. Shartning haqiqiyligi halqa tanasining har bir bajarilishidan oldin tekshiriladi. Agar birinchi iteratsiyadan oldin shart noto'g'ri bo'lsa, unda tsikl hech qachon bajarilmaydi.

// a o'zgaruvchini e'lon qilish va unga 0 qiymatini berish var a = 0; // a sharti bilan while sikli

Postshartli sikl do ... while

Do ... while tsikli, xuddi while sikli kabi, ma'lum bir shart to'g'ri bo'lsa, xuddi shu ko'rsatmalarni (siklning tanasi) bajaradi. Lekin while siklidan farqli o'laroq, do ... while sikli sikl tanasining har bir bajarilishidan keyin shartni tekshiradi. Agar shart dastlab noto'g'ri bo'lsa ham, tsikl tanasi baribir bir marta bajariladi (chunki shart tsikl tanasi bajarilgandan keyin tekshiriladi).

// a o'zgaruvchini e'lon qilish va unga 0 qiymatini berish var a = 0; // do ... while shart bilan sikl

Yuqorida ta'kidlab o'tilganidek, for ... in tsikli massiv elementlari va ob'ekt xususiyatlarini takrorlash uchun ishlatiladi. Bu darsda biz faqat for ... in tsiklining umumiy sintaksisini ko'rib chiqamiz va keyingi darslarda u bilan batafsilroq tanishamiz.

for ... in tsiklining printsipi x o'zgaruvchisi y ob'ektning barcha xossa nomlarini yoki y massiv indekslarini oladi. Shunday qilib, har bir iteratsiyada siz obyekt xususiyati yoki massiv elementiga kirishingiz mumkin.