Looping over Array ved hjælp af JavaScript forEach(), med eksempler

Denne artikel viser dig, hvordan du bruger JavaScript forEach() metode til at sløjfe over et array.

Stort set enhver anvendelse af enhver kompleksitet vil kræve looping over arrays (lister) af data.

 JavaScriptet forEach() metode, som er indbygget i JavaScript array variabler, gør netop dette. Du kommer til at bruge det meget - så heldigvis er det temmelig nemt at bruge.

JavaScript forEach() Syntaks

arr.forEach(callback(currentValue[, index[, array]]) {
    // execute something
}[, thisArg]);

Bemærk at:

  • arr er en matrix eller en variabel, der indeholder en matrix
  • tilbagekald er den funktion, der skal udføres for hvert element i arrayet
  • aktuel værdi er det aktuelle element, der behandles i arrayet, tilgængeligt i tilbagekaldsfunktionen
  • indeks kan eventuelt angives for at få indekset for currentValue mens du behandler arrayet og gør det tilgængeligt i tilbagekaldsfunktionen
  • array kan også specificeres valgfrit for at gøre det array tilgængeligt, der behandles i tilbagekaldsfunktionen
  • thisArg er den værdi, der skal bruges som denne når du udfører tilbagekaldet
    • dette er en variabel med en særlig betydning i JavaScript. Uanset hvor det bruges, henviser det til det objekt, det tilhører.
    • Hvis dette ikke giver nogen mening, så fortvivl ikke – det er ikke almindeligt brugt med forEach() – det vil give mening, efterhånden som du udvikler dig længere i forståelsen af ​​JavaScript og objektorienteret programmering
  • Der er ingen returværdi fra denne metode

JavaScript for hver () Eksempel

Her er et eksempel, der udskriver hvert element i en række biler sammen med det indeks, den er gemt på i arrayet:

var cars = ["ford", "holden", "lada", "fiat"];

cars.forEach(function(item, index){
    console.log(item + "exists at index" + index); // Will print the car name and the index it appears at
});

Hvis du vil have adgang til bilerne array fra forEach tilbagekaldsfunktion, mens den udføres, kan du videregive den som en valgfri tredje parameter:

cars.forEach(function(item, index, theArray){
    console.log(theArray); // theArray will contain the cars array as it as passed as the third parameter above
});

Den sjældent brugte og lidt forvirrende thisArg kan bruges som følger:

var driverObject = { name: 'tim', age: 54 }; // An object with details of a car driver

cars.forEach(function(item){ 
    console.log(item); // Will print the item from the cars list 
    console.log(this.name); // Will print 'tim', as driverObject was passed as the value to use when referring to the variable called 'this'
}, driverObject)

Igen, hvis thisArg giver ingen mening, det er OK, det er sjældent brugt, og det vil nok give mening, hvis/når tiden kommer til at bruge det.

Med hensyn til dette i sig selv er det et grundlæggende JavaScript-koncept – find ud af mere om det her.


No