Sök…


Syntax

  • för ( initialisering ; villkor ; slutlig_uttryck ) {}
  • för ( nyckel i objekt ) {}
  • för ( variabel av iterable ) {}
  • medan ( villkor ) {}
  • gör {} medan ( villkor )
  • för varje ( variabel i objekt ) {} // ECMAScript för XML

Anmärkningar

Loops i JavaScript hjälper vanligtvis att lösa problem som involverar upprepning av specifik kod x antal gånger. Säg att du måste logga ett meddelande 5 gånger. Du kan göra detta:

console.log("a message");
console.log("a message");
console.log("a message");
console.log("a message");
console.log("a message");

Men det är bara tidskrävande och typ av löjligt. Dessutom, om du behövde logga över 300 meddelanden? Du bör ersätta koden med en traditionell "för" -slinga:

for(var i = 0; i < 5; i++){
    console.log("a message");
}

Standard "för" slingor

Standardanvändning

for (var i = 0; i < 100; i++) {
    console.log(i);
}

Förväntad produktion:

0
1
...
99

Flera deklarationer

Vanligtvis används för att cache längden på en matris.

var array = ['a', 'b', 'c'];
for (var i = 0; i < array.length; i++) {
    console.log(array[i]);
}

Förväntad produktion:

'A'
'B'
'C'

Ändra steget

for (var i = 0; i < 100; i += 2 /* Can also be: i = i + 2 */) {
    console.log(i);
}

Förväntad produktion:

0
2
4
...
98

Dekrementerad slinga

for (var i = 100; i >=0; i--) {
    console.log(i);
}

Förväntad produktion:

100
99
98
...
0

"medan" Loops

Standard medan slingan

En standard medan loop kommer att köras tills det angivna villkoret är felaktigt:

var i = 0;
while (i < 100) {
    console.log(i);
    i++;
}

Förväntad produktion:

0
1
...
99

Dekrementerad slinga

var i = 100;
while (i > 0) {
    console.log(i);
    i--; /* equivalent to i=i-1 */
}

Förväntad produktion:

100
99
98
...
1

Gör ... medan Loop

En göra ... medan loop kommer alltid att köras minst en gång, oavsett om villkoret är sant eller falskt:

var i = 101;
do {
    console.log(i);
} while (i < 100);

Förväntad produktion:

101

"Bryt" ur en slinga

Bryter ur en stundslinga

var i = 0;
while(true) {
    i++;
    if(i === 42) {
        break;
    }
}
console.log(i);

Förväntad produktion:

42

Bryter ur en för-loop

var i;
for(i = 0; i < 100; i++) {
    if(i === 42) {
        break;
    }
}
console.log(i);

Förväntad produktion:

42

"fortsätt" en slinga

Fortsätter en "för" -slinga

När du sätter continue i en för slinga hoppar exekveringen till uppdateringsuttrycket ( i++ i exemplet):

for (var i = 0; i < 3; i++) {
    if (i === 1) {
        continue;
    }
    console.log(i);
}

Förväntad produktion:

0
2

Fortsätter en medan-loop

När du continue i en stundslinga hoppar exekveringen till villkoret ( i < 3 i exemplet):

var i = 0;
while (i < 3) {
    if (i === 1) {
        i = 2;
        continue;
    }
    console.log(i);
    i++;
}

Förväntad produktion:

0
2

"gör ... medan" slinga

var availableName;
do {
    availableName = getRandomName();
} while (isNameUsed(name));

En do while slinga garanteras att köras minst en gång eftersom dess tillstånd endast kontrolleras i slutet av en iteration. En traditionell while loop kan löpa noll eller flera gånger eftersom dess tillstånd kontrolleras i början av en iteration.

Bryt specifika kapslade öglor

Vi kan namnge våra slingor och bryta den specifika när det behövs.

outerloop:
for (var i = 0;i<3;i++){
    innerloup:
    for (var j = 0;j <3; j++){
        console.log(i);
        console.log(j);
        if (j == 1){
            break outerloop;    
        }
    }
}

Produktion:

0
0
0
1

Bryt och fortsätt etiketter

Break and continue-uttalanden kan följas av en valfri etikett som fungerar som någon form av ett goto-uttalande, återupptar körningen från den etikett som refereras till

for(var i = 0; i < 5; i++){
  nextLoop2Iteration:
  for(var j = 0; j < 5; j++){
    if(i == j) break nextLoop2Iteration;
    console.log(i, j);
  }
}

i = 0 j = 0 hoppar över resten av j-värden
1 0
i = 1 j = 1 hoppar över resten av j-värden
2 0
2 1 i = 2 j = 2 hoppar över resten av j-värden
3 0
3 1
3 2
i = 3 j = 3 hoppar över resten av j-värden
4 0
4 1
4 2
4 3
i = 4 j = 4 loggar inte och slingor är klara

"för ... av" slinga

6
const iterable = [0, 1, 2];
for (let i of iterable) {
    console.log(i);
}

Förväntad produktion:

0
1
2

Fördelarna med slingan för ... är:

  • Detta är den mest kortfattade, direkta syntaxen ännu för att gå igenom arrayelement
  • Det undviker alla fallgropar av för ... in
  • Till skillnad från forEach() fungerar det med paus, fortsättning och återkomst

Support för för ... av i andra samlingar

strängar

för ... av kommer att behandla en sträng som en sekvens av Unicode-tecken:

const string = "abc";
for (let chr of string) {
  console.log(chr);
}

Förväntad produktion:

a b c

Ställer

för ... av verk på Set-objekt .

Obs :

const names = ['bob', 'alejandro', 'zandra', 'anna', 'bob'];

const uniqueNames = new Set(names);

for (let name of uniqueNames) {
  console.log(name);
}

Förväntad produktion:

guppa
alejandro
Zandra
anna

Kartor

Du kan också använda för ... av slingor att iterera över kartor . Detta fungerar på samma sätt som matriser och uppsättningar, förutom att iterationsvariabeln lagrar både en nyckel och ett värde.

const map = new Map()
  .set('abc', 1)
  .set('def', 2)

for (const iteration of map) {
  console.log(iteration) //will log ['abc', 1] and then ['def', 2]
}

Du kan använda förstörande uppdrag för att fånga nyckeln och värdet separat:

const map = new Map()
  .set('abc', 1)
  .set('def', 2)

for (const [key, value] of map) {
  console.log(key + ' is mapped to ' + value)
}
/*Logs:
  abc is mapped to 1
  def is mapped to 2
*/

Objekt

för ... av slingor fungerar inte direkt på vanliga objekt; men det är möjligt att iterera över ett objekts egenskaper genom att växla till en för ... i loop eller använda Object.keys() :

const someObject = { name: 'Mike' };

for (let key of Object.keys(someObject)) {
  console.log(key + ": " + someObject[key]);
}

Förväntad produktion:

namn: Mike

"för ... i" slinga

Varning
för ... in är avsedd för iterering över objektnycklar, inte arrayindex. Att använda den för att slinga genom en matris är vanligtvis avskräckta . Den innehåller också egenskaper från prototypen, så det kan vara nödvändigt att kontrollera om nyckeln är inom objektet med hasOwnProperty . Om några attribut i objektet definieras av defineProperty/defineProperties definiera defineProperty/defineProperties och ställer in parametern uppräknbar enumerable: false kommer dessa attribut att vara otillgängliga.

var object = {"a":"foo", "b":"bar", "c":"baz"};
// `a` is inaccessible
Object.defineProperty(object , 'a', {
        enumerable: false,
});
for (var key in object) {
    if (object.hasOwnProperty(key)) {
      console.log('object.' + key + ', ' + object[key]);
    }
}

Förväntad produktion:

object.b, bar
object.c, baz



Modified text is an extract of the original Stack Overflow Documentation
Licensierat under CC BY-SA 3.0
Inte anslutet till Stack Overflow