A hurkok használata a JavaScriptben

A Looping lehetővé teszi, hogy a tömb minden egyes elemét megismételje, így tetszés szerint testreszabhatja és kiadhatja mindegyiket. Mint minden programozási nyelv, a hurkok is kulcsfontosságú eszközök a tömbök JavaScript -ben történő megjelenítéséhez.

Néhány gyakorlati példa segítségével merüljünk el mélyebben a ciklusok JavaScript -használatának különböző módjaiban.

A hurok növekménye és csökkenése a JavaScriptben

A növekményes számára a ciklus a JavaScript iterációjának alapja.

Feltételezi a változóhoz rendelt kezdeti értéket, és lefuttat egy egyszerű feltételes hosszúságú ellenőrzést. Ezután növeli vagy csökkenti ezt az értéket a ++ vagy -- üzemeltetők.

Így néz ki az általános szintaxisa:

for (var i = kezdeti érték; i tömb [i]}

Most ismételjük meg a tömböt a fenti alap szintaxis használatával:

anArray = [1, 3, 5, 6];
for (legyen i = 0; i console.log (anArray [i])
}
Kimenet:
1
3
5
6 

Most a fenti tömb minden elemét a JavaScript használatával fogjuk kezelni számára hurok:

anArray = [1, 3, 5, 6];





instagram viewer


for (legyen i = 0; i console.log ("5", "x", anArray [i], "=", anArray [i] * 5)
}
Kimenet:
5 x 1 = 5
5 x 3 = 15
5 x 5 = 25
5 x 6 = 30 

A ciklus fokozatosan iterál a tömbön a ++ operátor, rendelt kimenetet produkálva.

De a negatívot használva (--) operátor, megfordíthatja a kimenetet.

A szintaxisok megegyeznek, de a logika kissé eltér a fenti növekvő ciklustól.

Így működik a csökkentési módszer:

anArray = [1, 3, 5, 6];
for (legyen i = anArray.length-1; i> = 0; én-) {
console.log ("5", "x", anArray [i], "=", anArray [i]*5)
}
Kimenet:
5 x 6 = 30
5 x 5 = 25
5 x 3 = 15
5 x 1 = 5

A fenti kód mögött húzódó logika nem messzemenő. A tömbindexelés nulláról indul. Szóval hívás anArray [i] általában a nulla indextől a háromig ismétlődik, mivel a fenti tömb négy elemet tartalmaz.

Így az egyik eltávolítása a tömb hosszából és a feltétel nagyobb vagy egyenlő nullára állítása, mint mi, nagyon praktikus - különösen akkor, ha a tömböt az iteráció alapjául használja.

A tömbindexet eggyel kevesebbre tartja, mint a hossza. Az állapot i> = 0 majd arra kényszeríti a számlálót, hogy álljon meg a tömb utolsó eleménél.

Összefüggő: JavaScript tömb módszerek, amelyeket ma el kell sajátítania

JavaScript mindegyikhez

Bár a JavaScript használatával nem csökkenthet az egyes, gyakran kevésbé bőbeszédű, mint a nyers számára hurok. Úgy működik, hogy az egyik elemet a másik után választja, anélkül, hogy megjegyezné az előzőt.

Íme a JavaScript általános szintaxisa az egyes:

array.forEach (elem => {
akció
})

Nézze meg, hogyan működik a gyakorlatban:

legyen anArray = [1, 3, 5, 6];
anArray.forEach (x => {
console.log (x)
});
Kimenet:
1
3
5
6 

Most használja ezt egy egyszerű matematikai művelet futtatásához minden elemen, mint az előző részben:

legyen anArray = [1, 3, 5, 6];
anArray.forEach (x => {
console.log ("5", "x", x, "=", x * 5)
});
Kimenet:
5 x 1 = 5
5 x 3 = 15
5 x 5 = 25
5 x 6 = 30 

A... használata a JavaScript -hurokban

Az be ciklus a JavaScriptben egy tömbön keresztül iterál, és visszaadja annak indexét.

Könnyen megtalálhatja a használatát be ha ismerős A Python for loop mivel az egyszerűség és a logika tekintetében hasonlóak.

Nézze meg az általános szintaxist:

for (let elem a tömbben) {
akció 
}

Így a be A ciklus a tömb minden elemét a zárójelben deklarált változóhoz (elemhez) rendeli.

Így az elem naplózása közvetlenül a cikluson belül tömbindexet ad vissza, és nem magukat az elemeket:

legyen anArray = [1, 3, 5, 6];
for (hadd in anArray) {
console.log (i)
}
Kimenet:
0
1
2
3 

Ehelyett az egyes elemek kiadásához:

legyen anArray = [1, 3, 5, 6];
for (hadd in anArray) {
console.log (anArray [i])
}
Kimenet:
1
3
5
6 

Akárcsak a csökkenő ciklus használatakor, a kimenet használata is könnyen visszafordítható be:

legyen anArray = [1, 3, 5, 6];
// Távolítson el egyet a tömb hosszából, és rendelje hozzá egy változóhoz:
legyen v = anArray.length - 1; 
// A fenti változót használja index alapul, miközben a tömb lefelé iterál:
for (hadd in anArray) {
console.log (anArray [v])
v -= 1;
}
Kimenet:
6
5
3
1 

A fenti kód logikailag hasonló ahhoz, amit a csökkenő ciklus használata során tett. Ez azonban olvashatóbb és kifejezetten körvonalazott.

JavaScript for... of Loop

Az ... miatt hurok hasonló a be hurok.

Azonban ellentétben be, nem a tömbindexen keresztül iterál, hanem maguk az elemek.

Általános szintaxisa így néz ki:

for (hadd legyen tömb) {
akció 
}

Használjuk ezt a hurokolási módszert, hogy fokozatosan iteráljunk egy tömbön, hogy lássuk, hogyan működik:

legyen anArray = [1, 3, 5, 6];
for (let i of anArray) {
console.log (i)
}
Kimenet:
1
3
5
6 

Ezt a módszert használhatja a tömb iterálására és a kimenet megfordítására is. Hasonló ahhoz, ahogy ezt használod be:

legyen anArray = [1, 3, 5, 6];
legyen v = anArray.length - 1;
for (legyen x anArray) {
console.log (anArray [v])
v -= 1;
}
Kimenet:
6
5
3
1

Működés a körön belül:

legyen anArray = [1, 3, 5, 6];
legyen v = anArray.length - 1;
for (legyen x anArray) {
console.log ("5", "x", anArray [v], "=", anArray [v] * 5)
v -= 1;
}
Kimenet:
5 x 6 = 30
5 x 5 = 25
5 x 3 = 15
5 x 1 = 5 

A Míg hurok

Az míg ciklus folyamatosan fut, amíg egy meghatározott feltétel igaz marad. Gyakran végtelen hurokként használják.

Például, mivel a nulla mindig kevesebb, mint tíz, az alábbi kód folyamatosan fut:

legyen i = 0;
míg (én <10) {
console.log (4)
}

A fenti kód végtelenül naplózza a "4" -t.

Ismételjünk egy tömböt a míg hurok:

legyen i = 0;
while (i console.log (anArray [i])
i += 1
}
Kimenet:
1
3
5
6 

A JavaScript nem... miközben Loop

Az csinálni, miközben ciklus elfogadja és végrehajtja a műveletek halmazát kifejezetten a tedd szintaxis. Ezután kimondja ennek a műveletnek a feltételeit a míg hurok.

Így néz ki:

csinál {
cselekedetek
}
közben (
konzíció
)

Most ismételgessünk egy tömböt a következő hurokolási módszerrel:

csinál {
console.log (anArray [i])
i += 1
}
közben (
i )
Kimenet:
1
3
5
6 

Ismerje meg a JavaScript hurkokat

Bár itt kiemeltük a különböző JavaScript hurokolási módszereket, az iteráció alapjainak elsajátítása a programozásban lehetővé teszi, hogy rugalmasan és magabiztosan használja őket a programokban. Ennek ellenére a legtöbb JavaScript -hurok ugyanúgy működik, csak néhány különbség van az általános körvonalaikban és szintaxisaikban.

A hurkok azonban a legtöbb ügyféloldali tömbrendering alapját képezik. Tehát bátran módosítsa ezeket a hurokolási módszereket, ahogy tetszik. Ha például bonyolultabb tömbökkel használja őket, akkor jobban megértheti a JavaScript ciklusokat.

A JavaScript if-else utasítás használata

Az if-else utasítás az első lépés az alkalmazásokba való logika programozása felé.

Olvassa tovább

A szerzőről