Eine Einführung in Iteratoren und Generatoren in JavaScript

Seit 2015 hat EcmaScript6 (ES6) viele Fortschritte in der JavaScript-Codierung gebracht. In JavaScript wurden zahlreiche moderne Konzepte eingeführt, die die Programmiererfahrung erheblich verbessert haben. In diesem Artikel erfahren Sie mehr über Iteratoren und Generatoren in JavaScript.

Iteratoren und Generatoren sind zwei verschiedene Konzepte, die jedoch auf ähnliche Weise verwendet werden. Sie werden verwendet, um Arrays und Objekte in JavaScript zu durchlaufen.

Iteratoren

Iteratoren sind wie erweiterte Schleifen, die angehalten werden können. Iteratoren bestehen aus der Funktion next() , die den Wert und den Fertigstatus zurückgibt. Das Wertfeld ist der Wert im Array an einem bestimmten Index. done ist der boolesche Wert, der den Abschlussstatus für die Iteration durch die Schleife zurückgibt.

Hier ist ein Beispiel, das zeigt, wie Iteratoren:

 function fruitIter(fruits){
 let index = 0;
 return {
 next: function(){
 return index < fruits.length ? { value: fruits[index++], done: false } : {done: true}
 }
 }
 }
 const fruitsArray = ["Mango", "Banana", "Grapes"];
 const fruits = fruitIter(fruitsArray);
 console.log(fruits.next().value);

Ausgabe :

 Mango

Wenn Sie das fruitsArray Array in dem fruitIter () -Methode übergeben, gibt es einen Iterator, der in den Früchten Variable gespeichert wird . Der Index – Variable in der fruitIter () Methode wird diese Methode gibt die next () Funktion auf 0 initialisiert , die in hilft , durch das Array Looping . Die Funktion next() prüft, ob der Index kleiner als die Länge von fruitArray ist . Wenn ja, gibt es zwei Variablen zurück: den Fruchtnamen an diesem Index und den Fertigstatus . Beim Zurückgeben dieser Werte wird auch der Indexwert erhöht.

Um zu überprüfen, wie diese Methode funktioniert und den Fruchtnamen auszugeben, müssen Sie die next()- Funktion des Frucht- Iterators aufrufen und auf ihren Wert zugreifen.

Verwandte: Was ist eine Funktion in der Programmierung?

Generatoren

Generatoren ähneln Iteratoren, geben jedoch mehrere Werte zurück. Diese Werte werden Ertragswerte genannt. Generatorfunktionen werden mit der function*-Syntax geschrieben . * bedeutet, dass es sich nicht um eine normale Funktion, sondern um einen Generator handelt. Hier ein Beispiel für Generatoren:

 function* printFruits(){
 yield "Mango";
 yield "Banana";
 yield "Grapes";
 }
 const fruit = printFruits();
 console.log(fruit.next());

Ausgabe :

 {Wert: 'Mango', fertig: false}

In diesem Beispiel ist yield der Iterator. Wenn Sie die Funktion printFruits() aufrufen und fruit.next() drucken, erhalten Sie ein Objekt, in dem Sie den Wert erhalten. Die done Status gibt an , ob alle Werte wurden durch iteriert.

Lernen Sie Datenstrukturen mit ES6-Klassen in JavaScript kennen

JavaScript ES6 brachte viele Fortschritte in der Codierung. Nicht zuletzt der Aufbau von Datenstrukturen mit ES6-Klassen. Drücken. Pop, und stapeln Sie sich an die Spitze und werden Sie ein JavaScript-Profi!