Unterschiede und Anwendungsbeispiele von for, for...in, for...of und forEach in JS

Unterschiede und Anwendungsbeispiele von for, for...in, for...of und forEach in JS

for-Schleife

Grundlegendes Syntaxformat:

für (Variable initialisieren; bedingter Ausdruck; Operationsausdruck) {

Schleifenkörperanweisung;
}

Die normale For-Schleife kann sowohl in Arrays als auch in Objekten verwendet werden. In einer For-Schleife können Sie Return, Break usw. verwenden, um die Schleife zu unterbrechen.

//Array durchlaufen var arr = [1,2,3,4,5];
        für(var i=0;i<arr.length;i++){
            Konsole.log(arr[i]);
        }
//Das Objekt durchlaufen var obj={
            x0:10,
            x1:20,
            x2:30
        }
        für(var k=0;k<3;k++){
            Konsole.log(Objekt['x'+k]);
        }

Beim Durchlaufen von Objekten gibt es offensichtlich erhebliche Einschränkungen hinsichtlich der Benennung von Attributen und des Wertes von k.

forEach-Schleife

Grundlegendes Syntaxformat:

arr.forEach(Funktion(k){
konsole.log(k);
})

Nehmen Sie die Elemente nacheinander aus dem Array und fügen Sie sie in k ein. Übergeben Sie k dann als Parameter an die Funktion

.forEach() ist eine Methode des Array-Prototyps, mit der Sie über die Elemente eines Arrays iterieren können. .forEach() kann nicht über Objekte iterieren. Die forEach-Methode kann die break-Anweisung nicht verwenden, um aus der Schleife zu springen, oder return, um aus dem Funktionskörper zurückzukehren.

//Array durchlaufen var arr = [3,2,3,9,5];
         arr.forEach(Funktion(Wert,arr){
            konsole.log(Wert);
         })

für ... in einer Schleife

Grundlegendes Syntaxformat:

für (var-Variable im Array-Namen oder Sammlungsnamen)
{
Array-Name [Variable]
}

Der Index im Array oder in der Sammlung, die in der Variablen gespeichert ist.

 //Array durchlaufen var arr = [1,2,3,4,5];
        für(var i in arr){
            Konsole.log(arr[i]);
        }
//Das Objekt durchlaufen var obj={
            x0:10,
            x1:20,
            x2:30
        }
        für(var k in obj){
            konsole.log(obj[k]);
        }

1. Der Indexwert kann ein Zeichenfolgentyp sein

2. Die Schleife durchläuft nicht nur die Array-Elemente, sondern auch alle anderen hinzugefügten benutzerdefinierten Attribute. Wenn beispielsweise obj ein benutzerdefiniertes Attribut, obj.name, enthält, wird dieses Namensattribut auch in dieser Schleife angezeigt.

3. In einigen Fällen wird der obige Code das Array in zufälliger Reihenfolge durchlaufen

Als die For-In-Schleife erstmals entworfen wurde, wurde sie für Objekte mit Zeichenfolgenwerten als Schlüssel verwendet. anstelle eines Arrays.

für ... der Schleife

Grundlegendes Syntaxformat:

für (var-Variable des Array-Namens oder Sammlungsnamens)
{
konsole.log(variable);
}

Variablen speichern Elemente in Arrays oder Sammlungen.

 //Array durchlaufen var arr = [3,2,3,9,5];
         für (var Wert von arr) {
            konsole.log(Wert);
         }
//Das Objekt durchlaufen var obj={
            x0:10,
            x1:20,
            x2:30
        }
        für (var k von Object.entries(obj)) {
            konsole.log(k);
        }

Die Methode „entry()“ gibt ein Array-Iteratorobjekt zurück, das die Schlüssel-/Wertpaare des Arrays enthält.

Der Indexwert des Arrays im Iterationsobjekt wird als Schlüssel und das Array-Element als Wert verwendet.

1. Sie können alle Fallstricke der For-In-Schleife vermeiden

2. Im Gegensatz zu forEach() können Sie break, continue und return verwenden

3. Die For-of-Schleife unterstützt mehr als nur die Array-Durchquerung. Das Gleiche gilt für viele arrayähnliche Objekte.

4. Es unterstützt auch String-Traversierung

5. for-of ist nicht für die Verarbeitung ursprünglicher nativer Objekte geeignet

Zusammenfassen

1. „for...in“ wird verwendet, um über alle „aufzählbaren“ Eigenschaften eines Objekts zu iterieren, einschließlich der geerbten aufzählbaren Eigenschaften. Diese Iterationsanweisung kann für Array-Strings oder normale Objekte verwendet werden, jedoch nicht für Map- oder Set-Objekte.

2. „for...of“ wird für „iterierbare“ Objekte verwendet, wobei über deren Werte und nicht über deren Eigenschaften iteriert wird. Diese Iterationsanweisung kann mit Array-, String-, Map- oder Set-Objekten verwendet werden, jedoch nicht mit gewöhnlichen Objekten.

Dies ist das Ende dieses Artikels über die Unterschiede und Verwendungen von for, for...in, for...of und forEach in JS. Weitere Informationen zu den Unterschieden zwischen for, for...in, for...of und forEach in JS finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!

Das könnte Sie auch interessieren:
  • Verwendung und Unterschiedsanalyse der JS-Methoden forEach und map
  • Der Unterschied zwischen forEach und for in js

<<:  Docker führt Vorgänge mit dem angegebenen Speicher aus

>>:  Über visuelles Design und Interaktionsdesign

Artikel    

Artikel empfehlen

Methoden für JavaScript-String-Objekte

Inhaltsverzeichnis Methoden des String-Objekts Me...

Die vernachlässigten Spezialeffekte von META-Tags (Seitenübergangseffekte)

Durch die Verwendung von JS im Webdesign können vi...

Ausführliche Erklärung verschiedener binärer Objektbeziehungen in JavaScript

Inhaltsverzeichnis Vorwort Beziehungen zwischen v...

Vue kapselt die öffentliche Funktionsmethode zum Exportieren von Excel-Daten

vue+element UI kapselt eine öffentliche Funktion ...

Eine gründliche Analyse der HTML-Sonderzeichen

Eine gründliche Analyse von HTML (14) Sonderzeich...

Eine elegantere Methode zur Fehlerbehandlung in JavaScript async await

Inhaltsverzeichnis Hintergrund Warum Fehlerbehand...

So verwenden Sie JS WebSocket zur Implementierung eines einfachen Chats

Inhaltsverzeichnis Kurze Umfrage Langfristige Abf...

TypeScript-Lernhinweise: Typeingrenzung

Inhaltsverzeichnis Vorwort Typinferenz Einengung ...

Über die Überlappung von Randwert und vertikalem Rand in CSS

Rand paralleler Boxen (Überlappung doppelter Ränd...

Neun erweiterte Methoden zur Deduplizierung von JS-Arrays (erprobt und effektiv)

Vorwort Die allgemeinen Methoden sind hier nicht ...