JavaScriptFor循环

Løkker kan udføre kodeblokke flere gange.

JavaScript-løkker

Hvis du skal køre kode flere gange og bruge forskellige værdier hver gang, er løkker (loop) meget nyttige.

Vi møder ofte eksempler på brug af arrays:

ikke skriv det på denne måde:

text += biler[0] + "<br>"; 
text += biler[1] + "<br>"; 
text += biler[2] + "<br>"; 
text += biler[3] + "<br>"; 
text += biler[4] + "<br>"; 
text += cars[5] + "<br>";

Man kan skrive det sådan:

for (i = 0; i < cars.length; i++) { 
    text += cars[i] + "<br>";
 }

Prøv det selv

Forskellige typer af løkker

JavaScript understøtter forskellige typer af løkker:

  • for - Gennemgå kodeblokken flere gange
  • for/in - Gennemgå objektets egenskaber
  • while - Kør en kodeblok, når betingelsen er sand
  • do/while - Kør en kodeblok, når betingelsen er sand

For-løkke

For-løkke er et værktøj, der ofte bruges, når du vil oprette en løkke.

Syntaksen for for-løkke er som følger:

for (Setning 1; Setning 2; Setning 3) {
     Koden, der skal udføres
}

Setning 1 udføres før løkken (kodeblokken) starter.

Setning 2 definerer betingelsen for, at løkken skal køre (kodeblokken).

Setning 3 udføres efter hver udførelse af løkken (kodeblokken).

Eksempel

for (i = 0; i < 5; i++) {
     text += "Tallet er " + i + "<br>";
}

Prøv det selv

Fra ovenstående kode kan du finde ud af:

Setning 1 sætter en variabel før løkkens start (var i = 0).

Setning 2 definerer betingelsen for, at løkken skal køre (i skal være mindre end 5).

Setning 3 øger værdien efter hver udførelse af kodeblokken (i++).

Setning 1

Normalt bruger man setning 1 til at initialisere variablerne, der bruges i løkken (i = 0).

Men det er ikke altid tilfældet, JavaScript bryder sig ikke om det. Setning 1 er valgfri.

Man kan initialisere flere værdier i setning 1 (adskilt af kommaer):

Eksempel

for (i = 0, len = cars.length, text = ""; i < len; i++) { 
    text += cars[i] + "<br>";
}

Prøv det selv

Man kan også undlade setning 1 (f.eks. sætte værdien før løkkens start):

Eksempel

var i = 2;
var len = cars.length;
var text = "";
for (; i < len; i++) { 
    text += cars[i] + "<br>";
}

Prøv det selv

Setning 2

Normalt bruges setning 2 til at beregne betingelsen for den oprindelige variabel.

Men det er ikke altid tilfældet, JavaScript bryder sig ikke om det. Setning 2 er også valgfri.

Hvis setning 2 returnerer true, vil løkken starte forfra, hvis den returnerer false, vil løkken ende.

Hvis setning 2 udelades, skal der gives en i løkken. break. ellers vil løkken aldrig ende. Læs mere om break i det næste kapitel.

Setning 3

Normalt øges værdien af den oprindelige variabel ved setning 3.

Men det er ikke altid tilfældet, JavaScript bryder sig ikke om det. Setning 3 er også valgfri.

Setning 3 kan gøre alt, f.eks. negativ inkrementering (i--), positiv inkrementering (i = i + 15), eller noget andet.

sætning 3 kan også undlades (f.eks. når du øger værdien i løkken):

Eksempel

var i = 0;
var len = cars.length;
for (; i < len; ) { 
    text += cars[i] + "<br>";
      i++;
}

Prøv det selv

For/In-løkke

JavaScript for/in sætning kan gennemgå objektets egenskaber:

Eksempel

var person = {fname:"Bill", lname:"Gates", age:62}; 
var text = "";
var x;
for (x in person) {
    text += person[x];
}

Prøv det selv

While-løkke

Vi vil lære om while-løkker og do/while-løkker i det næste kapitel.

ekstrabøger

for mere information JavaScript for sætningmere information, læs relevante indhold i JavaScript avanceret tutorial:

ECMAScript iterativsætning
Iterativsætninger kaldes også løkkeudtryk. Dette afsnit præsenterer de fire iterativsætninger, som ECMAScript tilbyder.