JavaScript-sløjfer forklaret: For Loop, While Loop, Do ... While Loop og mere

Sløjfer bruges i JavaScript til at udføre gentagne opgaver baseret på en betingelse. Betingelser vender typisk tilbage trueeller falsenår de analyseres. En loop fortsætter, indtil den definerede tilstand vender tilbage false.

De tre mest almindelige typer af sløjfer er

  • til
  • mens
  • gøre imens

Du kan skrive js for, js whileeller js do whilefor at få mere information om nogen af disse. Lad os se på dem og nogle variationer mere detaljeret nu.

til løkke

Syntaks

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

Javascript- forerklæringen består af tre udtryk og en erklæring:

Beskrivelse

  • initialisering - Kør inden den første udførelse på sløjfen. Dette udtryk bruges ofte til at oprette tællere. Variabler, der oprettes her, afgrænses til sløjfen. Når løkken er afsluttet, er den udført, de ødelægges.
  • betingelse - Udtryk, der kontrolleres inden udførelsen af ​​hver iteration. Hvis det udelades, evalueres dette udtryk til sandt. Hvis det evalueres til sandt, udføres sløjfens erklæring. Hvis det evalueres til falsk, stopper sløjfen.
  • final-expression - Udtryk, der køres efter hver iteration. Normalt brugt til at øge en tæller. Men det kan også bruges til at mindske en tæller.
  • sætning - Kode, der skal gentages i sløjfen

ethvert af disse tre udtryk eller udsagnet kan udelades. For sløjfer bruges ofte til at tælle et bestemt antal iterationer for at gentage en sætning. Brug en breaksætning til at afslutte sløjfen, før betingelsesudtrykket evalueres til falsk.

Almindelige faldgruber

Overskrider grænserne for en matrix

Ved indeksering over en matrix mange gange er det let at overskride arrayets grænser (f.eks. Prøv at henvise til det 4. element i et 3-element array).

 // 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

Der er to måder at rette denne kode på. Indstil betingelsen til enten i < arr.lengthelleri <= arr.length - 1

Eksempler

Iterer gennem heltal fra 0-8

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

Bryde ud af en løkke, før betingelsesudtryk er falsk

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

til ... i løkke

Den for...inopgørelse gentager de enumerable egenskaber af et objekt, i vilkårlig rækkefølge. For hver særskilt ejendom kan udsagn udføres.

for (variable in object) { ... }

Påkrævet / ValgfriParameterDescriptionRequiredVariableEt andet egenskabsnavn tildeles variablen på hver iteration.OptionalObjectObject, hvis utallige egenskaber gentages.

Eksempler

// 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

til ... af løkke

Den for...ofsætning skaber en løkke iteration løbet Iterable genstande (herunder Array, kort, Set, argumenter objekt og så videre), påberåber en brugerdefineret iteration krog med erklæringer, der skal udføres for værdien af hvert enkelt ejendom.

 for (variable of object) { statement }

DescriptionvariablePå hver iteration tildeles variable.objectObject en værdi af en anden egenskab, hvis utallige egenskaber gentages.

Eksempler

Array

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

Kort

 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

Sæt

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

Argumenter objekt

 // 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

mens sløjfe

While-sløjfen starter med at evaluere tilstanden. Hvis betingelsen er sand, eksekveres erklæringen / erklæringerne. Hvis betingelsen er falsk, udføres erklæringen / erklæringerne ikke. Derefter, mens løkken slutter.

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...Whileloops sørger for, at koden udføres mindst en gang, og hvis betingelsen inde i den while()er sand , efter udførelsen, fortsætter den med løkken, ellers stopper den.

Opløsning:

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