A JavaScript hurkok magyarázata: A hurokhoz, míg a hurokhoz, a ... ... a hurokhoz és így tovább

A JavaScript-ben hurokokat használnak egy feltétel alapján ismételt feladatok végrehajtására. A körülmények általában visszatérnek, truevagy falseelemzéskor. A hurok addig folytatódik, amíg a megadott feltétel vissza nem tér false.

A három leggyakoribb huroktípus a

  • mert
  • míg
  • csinálni, miközben

Beírhat js for, js whilevagy js do whiletovábbi információkhoz juthat ezekről. Most nézzük meg őket és néhány variációt részletesebben.

hurokhoz

Szintaxis

for ([initialization]); [condition]; [final-expression]) { // statement }

A javascript forutasítás három kifejezésből és egy utasításból áll:

Leírás

  • inicializálás - Futtassa a ciklus első végrehajtása előtt. Ezt a kifejezést általában használják számlálók létrehozására. Az itt létrehozott változókat a hurok körébe soroljuk. Miután a ciklus befejeződött, végrehajtása megsemmisül.
  • feltétel - Kifejezés, amelyet minden iteráció végrehajtása előtt ellenőriznek. Ha nem, akkor ez a kifejezés igaznak minősül. Ha igaznak bizonyul, akkor a ciklus utasítása végrehajtásra kerül. Ha hamisnak értékeli, a hurok leáll.
  • végső kifejezés - minden iteráció után futó kifejezés. Általában számláló növelésére szolgál. De használható számláló csökkentésére is.
  • utasítás - A ciklusban megismételendő kód

A három kifejezés vagy az állítás bármelyike ​​elhagyható. Mert a ciklusokat általában bizonyos számú ismétlés megszámolására használják egy utasítás megismétléséhez. Használjon egy breakutasítást a ciklusból való kilépéshez, mielőtt a feltétel kifejezés hamisra értékelné.

Közös csapdák

Egy tömb határainak túllépése

Ha sokszor indexel egy tömb felett, könnyen túllépi a tömb határait (pl. Próbáljon meg hivatkozni egy 3 elemű tömb 4. elemére).

 // This will cause an error. // The bounds of the array will be exceeded. var arr = [ 1, 2, 3 ]; for (var i = 0; i <= arr.length; i++) { console.log(arr[i]); } output: 1 2 3 undefined

Kétféleképpen javíthatja ezt a kódot. Állítsa a feltételt vagy i < arr.lengthvagy értékrei <= arr.length - 1

Példák

0-8 közötti egész számokon keresztül iterálunk

for (var i = 0; i < 9; i++) { console.log(i); } output: 0 1 2 3 4 5 6 7 8

Kitör egy hurokból, mielőtt a feltétel kifejezés hamis lenne

for (var elephant = 1; elephant < 10; elephant+=2) { if (elephant === 7) { break; } console.info('elephant is ' + elephant); } output: elephant is 1 elephant is 3 elephant is 5

mert ... hurokban

Az for...inutasítás iterálja az objektum számtalan tulajdonságát, tetszőleges sorrendben. Minden különálló tulajdonság esetében utasításokat lehet végrehajtani.

for (variable in object) { ... }

Kötelező / OptionalParameterDescriptionRequiredVariable Minden változóhoz különböző tulajdonságnév kerül hozzárendelésre minden egyes iterációnál. OptionionalObjectObject, amelynek megszámlálható tulajdonságai ismétlődnek.

Példák

// Initialize object. a = { "a": "Athens", "b": "Belgrade", "c": "Cairo" } // Iterate over the properties. var s = "" for (var key in a) { s += key + ": " + a[key]; s += "

"; } document.write (s); // Output: // a: Athens // b: Belgrade // c: Cairo // Initialize the array. var arr = new Array("zero", "one", "two"); // Add a few expando properties to the array. arr["orange"] = "fruit"; arr["carrot"] = "vegetable"; // Iterate over the properties and elements. var s = ""; for (var key in arr) { s += key + ": " + arr[key]; s += "

"; } document.write (s); // Output: // 0: zero // 1: one // 2: two // orange: fruit // carrot: vegetable // Efficient way of getting an object's keys using an expression within the for-in loop's conditions var myObj = {a: 1, b: 2, c:3}, myKeys = [], i=0; for (myKeys[i++] in myObj); document.write(myKeys); //Output: // a // b // c

mert ... a hurok

Az for...ofutasítás létrehoz egy kört, amely iterálható objektumokon (beleértve az Array, Map, Set, Arguments objektumot és így tovább) iterál, egy egyedi iterációs horgot hívva meg az egyes különálló tulajdonságok értékére végrehajtandó utasításokkal.

 for (variable of object) { statement }

Minden egyes iterációnál egy másik tulajdonság értéke van hozzárendelve a változóhoz.objectObject, amelynek megszámlálható tulajdonságai iterálódnak.

Példák

Sor

 let arr = [ "fred", "tom", "bob" ]; for (let i of arr) { console.log(i); } // Output: // fred // tom // bob

Térkép

 var m = new Map(); m.set(1, "black"); m.set(2, "red"); for (var n of m) { console.log(n); } // Output: // 1,black // 2,red

Készlet

 var s = new Set(); s.add(1); s.add("red"); for (var n of s) { console.log(n); } // Output: // 1 // red

Érvek objektum

 // your browser must support for..of loop // and let-scoped variables in for loops function displayArgumentsObject() { for (let n of arguments) { console.log(n); } } displayArgumentsObject(1, 'red'); // Output: // 1 // red

míg hurok

A while ciklus a feltétel kiértékelésével indul. Ha a feltétel igaz, akkor az utasítás (oka) t végrehajtjuk. Ha a feltétel hamis, akkor az utasítás (oka) t nem hajtják végre. Ezt követően, míg a hurok véget ér.

Here is the syntax for while loop:

Syntax:

while (condition) { statement(s); }

statement(s): A statement that is executed as long as the condition evaluates to true.

condition: Here, condition is a Boolean expression which is evaluated before each pass through the loop. If this condition evaluates to true, statement(s) is/are executed. When condition evaluates to false, execution continues with the statement after the while loop.

Example:

 var i = 1; while (i < 10) { console.log(i); i++; // i=i+1 same thing } Output: 1 2 3 4 5 6 7 8 9

How to Iterate with JavaScript While Loops

While loops will run as long as the condition inside the ( ) is true. Example:

while(condition){ code... }

Hint 1:

Use a iterator variable such as i in your condition

var i = 0; while(i <= 4){ }

Spoiler Alert Solution Ahead!

Solution:

// Setup var myArray = []; // Only change code below this line. var i = 0; while (i <= 4){ myArray.push(i); i++; }

Do...while loop

The do...while loop is closely related to while loop. In the do while loop, the condition is checked at the end of the loop.

Here is the syntax for do...while loop:

Syntax:

 do { *Statement(s);* } while (*condition*);

statement(s): A statement that is executed at least once before the condition or Boolean expression is evaluated and is re-executed each time the condition evaluates to true.

condition: Here, a condition is a Boolean expression. If Boolean expression evaluates to true, the statement is executed again. When Boolean expression evaluates to false, the loops ends.

Example:

var i = 0; do { i = i + 1; console.log(i); } while (i < 5); Output: 1 2 3 4 5

How to Iterate with JavaScript Do…While Loops

  • Do...While loops makes sure that the code is executed at least once, and after the execution, if the condition inside the while() is true, it continues with the loop, otherwise it stop.

Solution:

var myArray = []; var i = 10; do { myArray.push(i); i++; } while(i <= 10);