Generator Functions in JavaScript - alles was ihr über yield wissen müsst

Werte Zuseher:in !
Vielen Dank für erneut herausragenden Geschmack! Du siehst grad übrigens noch besser als vor nem Monat aus!
So! Wir haben "so" gesagt!
Async/Await haben wir abgehakt. Jetzt machen wir mal mit nem einfachen Thema weiter *hust*:
Generator Functions sind ein mächtiges, aber auch recht unbekanntes JavaScript-Feature. Und zudem etwas, was unserer Ansicht nach schwer auf Anhieb zu verstehen ist.
Uns geht es so, dass wir oft denken: "Jetzt haben wir es verstanden" und dann doch wieder eine Kleinigkeit übersehen und dann alles wieder keinen Sinn ergibt. Ihr kennt das (vielleicht)!
Hier also unser Versuch, uns Generator Functions zu erklären. Also der erste Teil davon.
Es stellt sich heraus, dass Holger es doch nur ganz knapp nicht in 20 Minuten schafft.
Das nächste mal also noch schneller reden. :)

Wir geht es euch mit Generator Functions? Total einleuchtend? Oder ein Buch mit sieben Siegeln? Was wünscht ihr euch noch anders/besser erklärt?
Schreibt es uns in die Kommentare! Und ja äääh liken, abonnieren, Glocke drücken nicht vergessen.

In diesem Sinne: Papperlapapp - Spaß mit Klammern!

Vielen Dank fürs Zuschauen, viel Spaß und wir freuen uns sehr auf euer Feedback!

Stefan und Holger

Hier noch die Codebeispiele zum mit coden:

Die Generator Functions Serie:
Teil 1 - Alles was ihr über yield wissen müsst:
Dieses Video

Teil 2 - Anwendungsfälle für Generator Functions:

Teil 3 - Auf der Suche nach dem verlorenen next()

Quellen:

▬ Inhalt des Videos ▬▬▬▬▬▬▬▬▬▬
00:00 Begrüßung
01:15 Intro
02:32 Generator functions vs. functions
05:36 Die Fernsteuerung
08:18 Beispiel 1: eine leere generator function
12:51 Beispiel 2: das yield keyword
14:05 Beispiel 3: yield mit Parameter
15:23 yield und die EventLoop
16:36 Beispiel 4: Aufruf von next mit Parameter
20:52 yield *
22:37 Update aus der Postproduktion
23:22 Abschluss

[Computerschulung-duesseldorfDe]

Zuschauer mitnehmen? Papperlapapp! ... hier die große Review, Vergleich erste Folge vs. zweite Folge! (Service, weil dann brauchen alle anderen die Folgen gar nicht anzusehen!). Aber mal von hinten angefangen: 1) Synchronisierung am Ende der Hammer! Grimme-Preis-verdächtig! 2) Ton noch mal verbessert - welche Hardware ist es denn geworden? 3) Bessere T-Shirts als in Folge 1. 4) Aber, aber: Wo ist die hübsche Lampe? Und die tolle von schräg-unten-Kamera, wo man die hübsche Lampe so gut sieht?? 5) Ok, Zuschauer besser mitgenommen. Aber ich versteh' eh immer nur Klammer und denke an Karl Klammer von Microsoft 😕. Also in der Summe alles cremig, weiter so 😃! PS: Generator Functions in JavaScript sind bestimmt eine sehr gute Sache.

[christophbutschkau]

Wieder ziemlich cool geworden. Habt nen guten Sprung von der ersten Folge gemacht. Freue mich auf die nächste Runde. Anmerkung: Ihr bezieht euch ab und zu auf die Zeilen im Code. Die sind aber nicht eingeblendet :D (Ach und Darkmode wäre natürlich auch sexy ;)).

[Alltagsabenteuer]

Ich komme ja noch aus C++-Zeiten und da waren * was mit Pointern, und die konnte man wahlweise als "xxx* tralala" oder "xxx *tralala" schreiben - ist das hier auch so? Sind Generator Functions nur irgendwie merkwürdige Objekte / Zeiger? Der Sprung zu dem Test mit dem next(3) war mir tatsächlich zu hoch, gibt's da keinen Zwischenschritt, wie man erklären kann, was mit dem Parameter von next(…) passiert, bevor man dann noch so Spökes in der Generator Function macht, wo man das yield irgendwas anderem zuweist?