Asynchrone Iteratoren gegen asynchrone Generatoren in JavaScript
In JavaScript, Asynchrone Iteratoren Und Asynchrone Generatoren Bieten Sie die gleiche Funktionalität an, die mit den Primitiven der JavaScript -Sprache effektiv implementiert werden könnte. Warum also nicht eine einfache Lösung wählen, anstatt sich in eine andere Verwirrung zu versetzen?
In diesem Beitrag werden asynchrone Iteratoren gegenüber asynchronen Generatoren in JavaScript zusammen mit geeigneten Beispielen erörtert. So lass uns anfangen!
Iteratoren in JavaScript
In JavaScript, “Iteratoren”Werden verwendet, um auf synchrone Datenstrukturen wie Arrays, Karten und Sätze zuzugreifen. Sie basieren in erster Linie auf dem “nächste()"Methode, die zwei Eigenschaften umfasst:"nächste" Und "Wert”:
- Der "WertEigentum der nächste() Die Methode gibt den aktuellen Wert in der Iterationssequenz an.
- Der "ErledigtEigentum der nächste() Die Methode repräsentiert den Iterationsstatus, wo “FALSCH”Zeigt an, dass der Iterationsprozess abgeschlossen ist und“WAHR”Bedeutet, dass die Iteration unvollständig ist.
Jetzt werden wir die Arbeit von Iteratoren in JavaScript mit Hilfe eines Beispiels überprüfen.
Beispiel: Verwenden von Iteratoren in JavaScript
Wir werden eine "erstellen"Zahlen"Objekt mit zwei Eigenschaften:"Start" Und "Ende”. Dann werden wir eine hinzufügen “Iterationsfähigkeit" zum "Zahlen"Objekt, indem Sie die" verwenden "Symbol.Iterator ()" Methode.
Der "Symbol.Iterator ()Die Methode wird einmal am Anfang der “aufgerufenfür… von”Schleife und gibt ein iterables Objekt zurück. Nach der Ausführung dieser Operation die “für… vonDie Schleife zugreift auf das iterable Objekt und holt die Werte in der Iterationssequenz ab:
lass numbers =Start: 1,
Ende: 4,
[Symbol.Iterator] ()
zurückkehren
Strom: Dies.Start,
Zuletzt: das.Ende,
nächste()
if (das.aktuell <= this.last)
zurücksenden fone: false, Wert: Dies.Strom ++;
anders
return done: true;
;
;
Das oben gegebene “,“nächste()"Methode wird aufgerufen und zurückgibt das"Wert”Als Objekt:
für (lass den Wert der Zahlen)Alarm (Wert);
Schreiben Sie den bereitgestellten Code in das Konsolenfenster aus und führen Sie ihn aus:
Wir haben erfolgreich über jedes Element der "iteriert"ZahlenObjekt, das im folgenden GIF zu sehen ist:
Wie bereits erwähnt, können regelmäßige JavaScript -Iteratoren Ihnen helfen, die synchronen Daten zu iterieren. Was ist, wenn die Werte wegen einer Verzögerung asynchron sind? In einem solchen Szenario müssen Sie die implementieren Asynchrone Iteratoren In JavaScript.
Asynchrone Iteratoren in JavaScript
Die asynchronen Iteratoren sind in ES9 eingebettet, um die asynchronen Datenquellen zu verarbeiten. Es funktioniert ähnlich dem regulären Iterator, außer dass das “nächste()Methode in einem asynchronen Iterator gibt eine „zurück“ zurückVersprechen"Das löst das"Wert" Und "Erledigt”Eigenschaftenwerte eines Objekts.
Konvertieren Sie den regulären Iterator in JavaScript in asynchrone Iterator
Wenn Sie einen regulären Iterator in einen asynchronen Iterator konvertieren möchten, befolgen Sie die folgenden Anweisungen:
- Anstatt das "zu verwenden"Symbol.Iterator ()"Methode, verwenden"Symbol.Asynciterator ()”.
- Erzwingen Sie das "nächste()Methode zur Rückgabe a Versprechen und fügen Sie eine "hinzu"asynchron"Schlüsselwort damit als:"Async Next ()”.
- Zuletzt die “für warten…Schleife kann verwendet werden, um über ein Objekt anstelle der “zu iterierenfür… von”Schleife.
Beispiel: Asynchrone Iteratoren in JavaScript
Wir werden nun den im vorherigen Beispiel definierten regulären Iterator in asynchrone Iteratoren konvertieren, indem wir den angegebenen Regeln befolgen.
Zu diesem Zweck werden wir das ersetzen “Symbol.Iterator ()" mit dem "Symbol.Asynciterator ()" Methode. Dann werden wir das Schlüsselwort hinzufügen “asynchron" Vor dem "nächste()" Methode. Benutzen "erwarten" im "nächste()"Methode wird die Zeit für die Erfüllung des Versprechens feststellen"2Sekunden:
lass numbers =Start: 1,
Ende: 4,
[Symbol.Asynciterator] ()
zurückkehren
Strom: Dies.Start,
Zuletzt: das.Ende,
Async Next ()
AwaitNewPromise (Resolve => setTimeout (Resolve, 2000));
if (das.aktuell <= this.last)
zurücksenden fone: false, Wert: Dies.Strom ++;
anders
return done: true;
;
;
Für die Iteration über ein asynchrones iterables Objekt das “für warten…Die Schleife wird folgendermaßen verwendet:
(async () =>für auf wart (lass den Wert von Zahlen)
alarm (Wert);
) ())
In der Ausgabe werden die iterierten Werte im Alarmfeld nach einer Verzögerung von zwei Sekunden angezeigt:
Zu diesem Zeitpunkt haben Sie die Arbeit asynchroner Iteratoren verstanden. Jetzt werden wir weiterentwickeln und lernen Asynchrone Generatoren In JavaScript.
Generatoren in JavaScript
Iteratoren in JavaScript sind sehr nützlich; Sie brauchen jedoch sorgfältige Programmierung, um ihre erwartete Funktionalität durchzuführen. Der JavaScript -Generatorfunktion ist ein weiteres leistungsstarkes Werkzeug, das es Ihnen ermöglicht, einen iterativen Algorithmus mit Hilfe einer einzelnen zu definieren “nicht kontinuierlich”Funktion.
Zunächst führt eine Generatorfunktion ihren Code nicht aus, wenn er aufgerufen wird. Stattdessen gibt es eine bestimmte Art von Iterator zurück, die als "bekannt ist"Generator”. Die Generatorfunktion kann so oft nach Bedarf aufgerufen werden, und bei jedem Anruf gibt sie eine neue zurück. “Generator,Das kann einmal iteriert werden.
Um die Generatorfunktion zu schreiben, die “Funktion*”Syntax wird verwendet. Diese Funktion umfasst auch eine “ErtragOperator, der die Ausführung der Generatorfunktion bis zum nächsten Wert eines Objekts paustiert.
Beispiel: Verwenden von Generatoren in JavaScript
Wir werden eine definieren “GeneratorFunktion, die die Werte aus einem zurückgibtStartpunkt" Zu "Endpunkt" Verwendung der "Ertrag" Operator. Der "*"Hinzugefügt mit dem"Funktion"Das Schlüsselwort zeigt, dass“Generator()Ist eine Generatorfunktion, keine normale reguläre Funktion.
Funktion* Generator (Startpunkt, Endpunkt)für (lass i = startpoint; ich<= endingPoint; i++)
Rendite i;
Im nächsten Schritt werden wir die aufrufen “Generator()"Funktion, die einen in der" gespeicherten Generator zurückgibt "X" Objekt:
Sei x = Generator (1, 5);Zuletzt, um über das zu iterieren “X"Generator, wir werden die" verwenden "für… von”Schleife:
für (const num von x)Konsole.log (num);
Die Ausführung des bereitgestellten Programms zeigt die iterierten Werte:
Wenn Sie vielversprechende Ergebnisse aus der “abrufen möchten“Generator"Sie müssen benutzen"Asynchroner Generator”Im JavaScript -Programm.
Asynchrone Generatoren in JavaScript
Asynchroner Generator in JavaScript funktioniert ähnlich der Generatorfunktion, außer dass die “nächste()"Methode im asynchronen Generator gibt eine" zurück "zurückVersprechen"Das löst das"Wert" Und "Erledigt”Eigenschaftenwerte eines Objekts.
Konvertieren Sie die Generatorfunktion in asynchroner Iterator in JavaScript in JavaScript
Befolgen Sie die folgenden Anweisungen, um eine Generatorfunktion in einen asynchronen Iterator in JavaScript umzuwandeln:
- Verwenden "asynchron" Vor dem "Funktion*" Stichwort.
- Anstelle einer "Wert","Ertrag"Sollte eine zurückgeben"Versprechen”.
Jetzt zeigen wir Ihnen die praktische Prozedur für die Konvertierung einer Generatorfunktion in asynchrone Generatoren in JavaScript.
Beispiel: Asynchrone Generatoren in JavaScript
Zunächst werden wir das hinzufügen "asynchron"Schlüsselwort, bevor Sie das definieren"Asyncsequence ()”Asynchrone Funktion. Die Asyncsequence () ergibt eine “VersprechenDie in einer Sekunde erfüllt werden:
asyncfunktion* asyncsequence (startpoint, EndingPoint)für (lass i = startpoint; i
setTimeout (() =>
Entschlossenheit (i);
, 1000);
);
Zuletzt, "für warten…Die Schleife wird verwendet, um den asynchronen Generator zu iterieren und zurückzugeben:
(async () =>Sei x = asyncsequence (1, 5);
für auf wartung (sei num von x)
Konsole.log (num);
) ();
Dieses JavaScript -Programm gibt Werte aus “zurück“1" Zu "5"Während ich eine Lücke von" einnehme "eins" zweite:
Wir haben die wesentlichen Informationen zur Verfügung gestellt Asynchrone Iteratoren Und Asynchrone Generatoren. Beide können jedoch zur Iterierung asynchroner Daten in JavaScript verwendet werden. Für Anfänger kann es schwierig sein, die interne Logik oder Definition der asynchronen Iteratoren aufrechtzuerhalten, während die asynchronen Generatoren eine mehr bieten effizient Und Weniger fehleranfällig Art, Iteratoren zu nutzen. Es verbirgt auch das Komplexität des Iterators und macht Code prägnant und lesbar.
Also empfehlen wir Sie Verwenden Sie asynchrone Generatoren Um Iterationen im Zusammenhang mit der asynchronen Datenerfassung zu behandeln.
Abschluss
Asynchroner Iterators und Asynchrone Generatoren werden verwendet, um die Daten zu iterieren, die nach einer bestimmten Zeitspanne bereitgestellt werden. Die asynchronen Iteratoren führen die aus “ausSymbol.Asynciterator ()”Methode zur Rückgabe eines“Iterator"Während die asynchronen Generatoren einen speziellen Iteratortyp zurückgeben"GeneratorSelbst, die überall dort verwendet werden können, wo die Iteration erforderlich ist. In diesem Bericht wurden in JavaScript asynchrone Iteratoren und asynchrone Generatoren besprochen.