Mit zunehmender Beliebtheit des asynchronen / wartenden Konstrukts wächst auch das Interesse an seinen internen Mechanismen. Nach dem Stöbern im Internet ist es leicht herauszufinden, dass Async / Warten auf bekannten Versprechungen und Generatoren basiert, die viel weniger berühmt und beliebt sind.
Das Material, dessen Übersetzung wir heute veröffentlichen, ist Generatoren gewidmet. Hier werden wir nämlich darüber sprechen, wie sie funktionieren und wie sie zusammen mit Versprechungen im Darm des asynchronen / wartenden Konstrukts verwendet werden. Der Autor dieses Artikels sagt, dass Generatoren für ihre praktische Anwendung nicht notwendig sind, um sie zu beherrschen. Darüber hinaus stellt er fest, dass er erwartet, dass der Leser sich ein wenig mit Versprechungen auskennt.
Iteratoren und Generatoren
In JavaScript wurden ab der Veröffentlichung des ES6-Standards mehrere neue Funktionen veröffentlicht, die die Arbeit mit asynchronen Datenströmen und Sammlungen vereinfachen sollen.
Iteratoren und Generatoren fallen in diese Kategorie.
Ein bemerkenswertes Merkmal von Iteratoren ist, dass sie die Möglichkeit bieten, einzeln auf Sammlungselemente zuzugreifen und gleichzeitig die Kennung des aktuellen Elements zu verfolgen.
function makeIterator(array) { var nextIndex = 0; console.log("nextIndex =>", nextIndex); return { next: function() { return nextIndex < array.length ? { value: array[nextIndex++], done: false } : { done: true }; } }; } var it = makeIterator(["simple", "iterator"]); console.log(it.next()); // {value: 'simple, done: false} console.log(it.next()); // {value: 'iterator, done: false} console.log(it.next()); // {done: true}
Oben übergeben wir der Funktion
makeIterator() ein kleines Array, das einige Elemente enthält.
makeIterator() durchlaufen wir es mit einem Iterator und rufen die Methode
it.next() . Beachten Sie die Kommentare, die die mit dem Iterator erzielten Ergebnisse demonstrieren.
Sprechen wir jetzt über Generatoren. Generatoren sind Funktionen, die wie Iteratorfabriken funktionieren. Betrachten Sie ein einfaches Beispiel und sprechen Sie dann über zwei Mechanismen, die sich auf Generatoren beziehen.
function* sample() { yield "simple"; yield "generator"; } var it = sample(); console.log(it.next()); // {value: 'simple, done: false} console.log(it.next()); // {value: 'generator, done: false} console.log(it.next()); // {value: undefined, done: true}
Beachten Sie das Sternchen in der Funktionsdeklaration. Dies zeigt an, dass diese Funktion ein Generator ist. Schauen Sie sich auch das
yield Schlüsselwort an. Es unterbricht die Ausführung der Funktion und gibt einen bestimmten Wert zurück. Tatsächlich sind diese beiden Merkmale genau die beiden Mechanismen, über die wir oben gesprochen haben:
- Eine Generatorfunktion ist eine Funktion, die mit einem Sternchen neben dem
function oder neben dem function deklariert wird. - Der Generatoriterator wird erstellt, wenn die Generatorfunktion aufgerufen wird.
Im Allgemeinen zeigt das obige Beispiel den Betrieb einer Factory-Funktion, die Iteratoren generiert.
Nachdem wir die Grundlagen herausgefunden haben, lassen Sie uns über interessantere Dinge sprechen. Iteratoren und Generatoren können Daten in zwei Richtungen austauschen. Generatoren können nämlich mit dem Schlüsselwort
yield Werte an Iteratoren zurückgeben. Iteratoren können jedoch auch Daten mit der Methode
iterator.next('someValue') an Generatoren senden. So sieht es aus.
function* favBeer() { const reply = yield "What is your favorite type of beer?"; console.log(reply); if (reply !== "ipa") return "No soup for you!"; return "OK, soup."; } { const it = favBeer(); const q = it.next().value; // console.log(q); const a = it.next("lager").value; // console.log(a); } // What is your favorite beer? // lager // No soup for you! { const it = favBeer(); const q = it.next().value; // console.log(q); const a = it.next("ipa").value; // console.log(a); } // What is your favorite been? // ipa // OK, soup.
Generatoren und Versprechen
Jetzt können wir darüber sprechen, wie Generatoren und Versprechen die Grundlage des Konstrukts async / await bilden. Stellen Sie sich vor, der Generator gibt Versprechen zurück, anstatt einige Werte mit dem Schlüsselwort
yield . In dieser Situation kann der Generator in eine Funktion eingeschlossen werden, die darauf wartet, dass das Versprechen aufgelöst wird, und den Wert des Versprechens in der Methode
.next() an den Generator
.next() , wie im vorherigen Beispiel gezeigt. Es gibt eine beliebte Bibliothek,
co , die genau solche Aktionen ausführt. Es sieht so aus:
co(function* doStuff(){ var result - yield someAsyncMethod(); var another = yield anotherAsyncFunction(); });
Zusammenfassung
Laut dem Autor dieses Materials müssen JS-Entwickler nur wissen, wie Generatoren funktionieren, um die Merkmale der internen Struktur des asynchronen / erwarteten Designs zu verstehen. Aber es lohnt sich nicht, sie direkt in Ihrem eigenen Code zu verwenden. Generatoren bieten in JavaScript die Möglichkeit, die Funktion anzuhalten und zu ihr zurückzukehren, wenn (und wenn) der Entwickler dies für erforderlich hält. Bisher haben wir bei der Arbeit mit JS-Funktionen erwartet, dass sie beim Aufruf einfach von Anfang bis Ende ausgeführt werden. Die Möglichkeit, sie anzuhalten, ist bereits etwas Neues, aber diese Funktionalität ist bequem im async / await-Konstrukt implementiert.
Natürlich kann man mit dieser Meinung argumentieren. Eines der Argumente für Generatoren ist beispielsweise, dass das Wissen, wie sie funktionieren, zum Debuggen von Code mit async / await hilfreich ist, da Generatoren in diesem Konstrukt versteckt sind. Der Autor des Materials ist jedoch der Ansicht, dass dies jedoch etwas anderes ist als die Verwendung von Generatoren in nativem Code.
Liebe Leser! Was halten Sie von den Generatoren? Vielleicht kennen Sie einige Optionen für ihre Verwendung, die ihre direkte Anwendung im Code von JS-Projekten rechtfertigen?
Royal Promotion Code für 10% Rabatt auf unsere virtuellen Server:
