JQuery – Durchlaufen von Arrays, Objekten und Elementen. So erstellen Sie ein assoziatives Array in JavaScript und konvertieren es in ein reales Array

• I. Iterieren über reale Arrays
• forEach-Methode und verwandte Methoden
• for-Schleife
• Richtige Verwendung der for...in-Schleife
• for...of-Schleife (implizite Verwendung des Iterators)
• Explizite Verwendung des Iterators
• Verwenden von Methoden zum Durchlaufen realer Arrays
• In ein echtes Array konvertieren
• Ein Hinweis zu Laufzeitobjekten

Anwendungsbeispiel:
var a = ["a", "b", "c"]; a.forEach(function(entry) ( console.log(entry); ));
Im Allgemeinen erfordert die Verwendung von forEach eine Verbindung mit der Emulationsbibliothek es5-shim für Browser, die diese Methode nicht nativ unterstützen. Dazu gehören IE 8 und höher frühe Versionen, die hier und da noch im Einsatz sind.

Der Vorteil von forEach besteht darin, dass keine lokalen Variablen zum Speichern des Index und des Werts des aktuellen Array-Elements deklariert werden müssen, da diese automatisch als Argumente an die Rückruffunktion übergeben werden.

Wenn Sie sich Sorgen über die möglichen Kosten für einen Rückruf für jedes Element machen, machen Sie sich keine Sorgen und lesen Sie dies.

ForEach ist so konzipiert, dass es alle Elemente eines Arrays durchläuft. Darüber hinaus bietet ES5 jedoch mehrere weitere nützliche Methoden zum Durchlaufen aller oder einiger Elemente sowie zum Durchführen einiger Aktionen an ihnen:

• every – gibt true zurück, wenn der Callback für jedes Element des Arrays einen Wert zurückgibt, der in true konvertiert werden kann.
• some – gibt „true“ zurück, wenn der Rückruf für mindestens ein Element des Arrays einen Wert zurückgibt, der in „true“ konvertiert werden kann.
• filter – erstellt ein neues Array, das die Elemente des ursprünglichen Arrays enthält, für die der Rückruf true zurückgibt.
• Karte – erstellt ein neues Array bestehend aus den vom Rückruf zurückgegebenen Werten.
• Reduzieren – Reduziert ein Array auf einen einzelnen Wert und wendet nacheinander einen Rückruf auf jedes Element des Arrays an, beginnend mit dem ersten (kann nützlich sein, um die Summe von Array-Elementen und anderen Zusammenfassungsfunktionen zu berechnen).
• ReduceRight – funktioniert ähnlich wie Reduce, durchläuft die Elemente jedoch in umgekehrter Reihenfolge.

Var a = ["a", "b", "c"]; Var-Index; für (Index = 0; Index< a.length; ++index) { console.log(a); }
Wenn die Länge des Arrays während der gesamten Schleife konstant ist und die Schleife selbst zu einem leistungskritischen Codeabschnitt gehört (was unwahrscheinlich ist), können Sie eine „optimalere“ Version von for verwenden, die die Länge des Arrays speichert :

Var a = ["a", "b", "c"]; var index, len; for (index = 0, len = a.length; index< len; ++index) { console.log(a); }
Theoretisch sollte dieser Code etwas schneller laufen als der vorherige.

Wenn die Reihenfolge der Elemente nicht wichtig ist, können Sie im Hinblick auf die Optimierung sogar noch weiter gehen und die Variable zum Speichern der Länge des Arrays entfernen und die Reihenfolge der Suche in das Gegenteil ändern:

Var a = ["a", "b", "c"]; Var-Index; for (index = a.length - 1; index >= 0; --index) ( console.log(a); )
In modernen JavaScript-Engines bedeuten solche Optimierungsspiele jedoch meist nichts.

In manchen Fällen, beispielsweise bei der Iteration über Arrays mit geringer Dichte, kann for...in jedoch nützlich sein, sofern Sie Vorsichtsmaßnahmen treffen, wie im folgenden Beispiel gezeigt:

// a - Sparse-Array var a = ; a = „a“; a = „b“; a = „c“; for (var key in a) ( if (a.hasOwnProperty(key) && /^0$|^\d*$/.test(key) && key 0) ( result = true; ) return result; ); var übergeben = zahlen.every(condition); document.write(bestanden); // FALSCH

Der Methode every() wird eine Funktion übergeben, die die Bedingung als Parameter darstellt. Diese Funktion benötigt drei Parameter:

Funktionsbedingung (Wert, Index, Array) ( )

Der Wertparameter stellt das aktuelle Array-Element dar, das iteriert wird, der Indexparameter stellt den Index dieses Elements dar und der Array-Parameter übergibt einen Verweis auf das Array.

In dieser Funktion können wir den übergebenen Elementwert auf Übereinstimmung mit einer Bedingung überprüfen. In diesem Beispiel überprüfen wir beispielsweise jedes Element des Arrays, um festzustellen, ob es größer als Null ist. Ist er größer, geben wir den Wert true zurück, d. h. das Element erfüllt die Bedingung. Wenn weniger, dann wird false zurückgegeben – das Element erfüllt die Bedingung nicht.

Wenn die Methode „numbers.every(condition)“ aufgerufen wird, durchläuft sie daher alle Elemente des Arrays „Zahlen“ und übergibt sie nacheinander an die Funktion „Bedingung“. Wenn diese Funktion für alle Elemente „true“ zurückgibt, gibt die Methode every() „true“ zurück. Wenn mindestens ein Element nicht mit der Bedingung übereinstimmt, gibt die Methode every() false zurück.

Die Methode some() ähnelt der Methode every(), prüft jedoch, ob mindestens ein Element einer Bedingung entspricht. Und in diesem Fall gibt die Methode some() true zurück. Wenn im Array keine Elemente vorhanden sind, die der Bedingung entsprechen, wird false zurückgegeben:

Var-Zahlen = [ 1, -12, 8, -4, 25, 42 ]; Funktionsbedingung(Wert, Index, Array) ( var result = false; if (value === 8) ( result = true; ) return result; ); var übergeben = zahlen.einige(Bedingung); // WAHR

Die Methode filter() akzeptiert wie some() und every() eine Bedingungsfunktion. Aber gleichzeitig wird ein Array der Elemente zurückgegeben, die diese Bedingung erfüllen:

Var-Zahlen = [ 1, -12, 8, -4, 25, 42 ]; Funktionsbedingung(Wert, Index, Array) ( var result = false; if (value > 0) ( result = true; ) return result; ); var filteredNumbers = zahlen.filter(bedingung); for(var i=0; i< filteredNumbers.length; i++) document.write(filteredNumbers[i] + "
");

Browserausgabe:

1 8 25 42

Die Methoden forEach() und map() iterieren über Elemente und führen bestimmte Operationen an ihnen aus. Um beispielsweise die Quadrate von Zahlen in einem Array zu berechnen, können Sie den folgenden Code verwenden:

Var-Zahlen = [1, 2, 3, 4, 5, 6]; for(var i = 0; i

• HTML
• JavaScript

Schauen wir uns eine Möglichkeit an, den letzten Index (das letzte Element) in zu bestimmen jQuery-Methode jede.

// Elemente auswählen var myList = $("ul li"); // Anzahl der Elemente in der Auswahl bestimmen var total = myList.length; // Durch die ausgewählten Elemente iterieren myList.each(function(index) ( if (index === total - 1) ( // dies ist das letzte Element in der Auswahl ) ));

Mit der JavaScript-Methode forEach() können Sie die übergebene Funktion einmal für jedes Element im Array in aufsteigender Indexreihenfolge ausführen.

Bitte beachten Sie, dass die als Parameter an die Methode forEach() übergebene Callback-Funktion nicht für gelöschte oder fehlende Array-Elemente aufgerufen wird.

Der Bereich der mit der Methode forEach() verarbeiteten Elemente wird zuvor festgelegt Erste Aufruf der Callback-Funktion. Wenn dem Array nach seinem Aufruf Elemente hinzugefügt wurden, wird die Funktion für diese Elemente nicht aufgerufen.

Wenn sich die Werte vorhandener Array-Elemente zur Ausführungszeit ändern, ist der an die Funktion übergebene Wert der Wert zu dem Zeitpunkt, an dem die forEach()-Methode sie besucht. Wenn Elemente vor dem Besuch gelöscht werden, werden diese Elemente nicht besucht. Wenn beim Durchlaufen des Arrays bereits besuchte Elemente entfernt werden, werden spätere Elemente übersprungen.

Im folgenden Beispiel schauen wir uns an, wie wir mithilfe von die Summe aller Elemente eines Arrays ermitteln JavaScript forEach()-Methode:

Im folgenden Beispiel schauen wir uns die Verwendung an zweite Argument der forEach()-Methode, das auf ein Objekt verweist, mit dem wir referenzieren können Stichwort Dies innerhalb der Callback-Funktion:

• I. Iterieren über reale Arrays
• forEach-Methode und verwandte Methoden
• for-Schleife
• Richtige Verwendung der for...in-Schleife
• for...of-Schleife (implizite Verwendung des Iterators)
• Explizite Verwendung des Iterators
• II. Iterieren über Array-ähnliche Objekte
• Verwenden von Methoden zum Durchlaufen realer Arrays
• In ein echtes Array konvertieren
• Ein Hinweis zu Laufzeitobjekten

Derzeit gibt es drei Möglichkeiten, die Elemente eines realen Arrays zu durchlaufen:

Darüber hinaus werden mit der Einführung des neuen Standards ECMAScript 6 (ES 6) bald zwei weitere Methoden erwartet:

Wenn Ihr Projekt die Funktionen des ECMAScript 5 (ES5)-Standards unterstützen soll, können Sie eine seiner Innovationen verwenden – die forEach-Methode.

Anwendungsbeispiel:

Var a = ["a", "b", "c"]; a.forEach(function(entry) ( console.log(entry); ));

Im Allgemeinen erfordert die Verwendung von forEach eine Verbindung mit der Emulationsbibliothek es5-shim für Browser, die diese Methode nicht nativ unterstützen. Dazu gehören IE 8 und früher, die mancherorts noch im Einsatz sind.

Der Vorteil von forEach besteht darin, dass keine lokalen Variablen zum Speichern des Index und des Werts des aktuellen Array-Elements deklariert werden müssen, da diese automatisch als Argumente an die Rückruffunktion übergeben werden.

Wenn Sie sich Sorgen über die möglichen Kosten für einen Rückruf für jedes Element machen, machen Sie sich keine Sorgen und lesen Sie dies.

forEach ist darauf ausgelegt, alle Elemente eines Arrays zu durchlaufen, aber darüber hinaus bietet ES5 mehrere weitere nützliche Methoden zum Durchlaufen aller oder einiger Elemente sowie zum Ausführen einiger Aktionen an ihnen:

• every – gibt true zurück, wenn der Callback für jedes Element des Arrays einen Wert zurückgibt, der in true konvertiert werden kann.
• some – gibt „true“ zurück, wenn der Rückruf für mindestens ein Element des Arrays einen Wert zurückgibt, der in „true“ konvertiert werden kann.
• filter – erstellt ein neues Array, das die Elemente des ursprünglichen Arrays enthält, für die der Rückruf true zurückgibt.
• Karte – erstellt ein neues Array bestehend aus den vom Rückruf zurückgegebenen Werten.
• Reduzieren – Reduziert ein Array auf einen einzelnen Wert und wendet nacheinander einen Rückruf auf jedes Element des Arrays an, beginnend mit dem ersten (kann nützlich sein, um die Summe von Array-Elementen und anderen Zusammenfassungsfunktionen zu berechnen).
• ReduceRight – funktioniert ähnlich wie Reduce, durchläuft die Elemente jedoch in umgekehrter Reihenfolge.

Gute alte Regeln:

Var a = ["a", "b", "c"]; Var-Index; für (Index = 0; Index< a.length; ++index) { console.log(a); }

Wenn die Länge des Arrays während der gesamten Schleife konstant ist und die Schleife selbst zu einem leistungskritischen Codeabschnitt gehört (was unwahrscheinlich ist), können Sie eine „optimalere“ Version von for verwenden, die die Länge des Arrays speichert :

Var a = ["a", "b", "c"]; var index, len; for (index = 0, len = a.length; index< len; ++index) { console.log(a); }

Theoretisch sollte dieser Code etwas schneller laufen als der vorherige.

Wenn die Reihenfolge der Elemente nicht wichtig ist, können Sie im Hinblick auf die Optimierung sogar noch weiter gehen und die Variable zum Speichern der Länge des Arrays entfernen und die Reihenfolge der Suche in das Gegenteil ändern:

Var a = ["a", "b", "c"]; Var-Index; for (index = a.length - 1; index >= 0; --index) ( console.log(a); )

In modernen JavaScript-Engines bedeuten solche Optimierungsspiele jedoch meist nichts.

Wenn Ihnen die Verwendung einer for...in-Schleife empfohlen wird, denken Sie daran, dass die Iteration über Arrays nicht der Zweck ist, für den sie gedacht ist. Entgegen einem weit verbreiteten Missverständnis iteriert die for...in-Schleife nicht über Array-Indizes, sondern durch aufzählbare Eigenschaften eines Objekts.

In manchen Fällen, beispielsweise bei der Iteration über Arrays mit geringer Dichte, kann for...in jedoch nützlich sein, sofern Sie Vorsichtsmaßnahmen treffen, wie im folgenden Beispiel gezeigt:

// a - Sparse-Array var a = ; a = „a“; a = „b“; a = „c“; for (var key in a) ( if (a.hasOwnProperty(key) && /^0$|^d*$/.test(key) && key