Asynchrone Programmierung in JavaScript in 80 Minuten // deutsch

[@orange-vlcybpd2]

Es ist sehr angenehm dir zu folgen, weil du jeden Denkschritt kommentierst und konsequent vorgehst.

[@thenativeweb]

[gr] Vielen lieben Dank 😊

[@cgsman1]

Ja, in der Tat! Du erklärst sehr deutlich und umfassend - und dennoch ohne "Längen". Man ist dann hinterher selbst in der Lage, Deine Beispiele aus dem Gedächtnis nachzuprogrammieren - gerne noch mehr davon!

[@schneider.mariane]

Über die Jahre hinweg bin ich durch Stack Overflow genau den hier skizzierten Weg gegangen. Ein Hochgenuss dies kompakt und gut strukturiert mit Background nachträglich erklärt zu bekommen. Danke.

[@thenativeweb]

[gr] Sehr gerne 😊

[@kastenkarsten]

Absolut geniales und lehrreiches Video zu dem Thema und auch darüber hinaus. Echt sprachlos wieviel Wissen Du in knapp 80 Minuten verpackt hast :) vielen großen Dank dafür und beste Grüße.

[@thenativeweb]

[gr] Vielen, vielen Dank 😊

[@wassagtmanndazu]

Danke!

[@thenativeweb]

[gr] Vielen, vielen Dank 🥰

[@boothtml9069]

Es ist so eine Bereicherung das es Euren Kanal gibt 💪.

[@thenativeweb]

[gr] Vielen, vielen Dank 😊

[@MarkusEicher70]

Hallo Golo. Also jetzt mal ehrlich, das haut mich echt vom Hocker! Vielen Dank für dieses ausgezeichnete Video. Ich werde wohl inzwischen als absoluter Fanboy wahrgenommen, aber es ist eine wahre Freude, Deinen Ausführungen folgen zu dürfen. Der Weg von der Callback Hölle zu dem eleganten Code zum Schluss ist faszinierend und ich habe wirklich viel mitgenommen. Ich werde gleich mal meinen Deutsch sprechenden Community Mitgliedern wärmstens empfehlen, sich das anzusehen. Schönen Sonntag. Gruss aus der Schweiz.

[@thenativeweb]

[gr] Vielen, vielen Dank - das freut mich sehr 😊

[@wassagtmanndazu]

Super gut erklärt. Das beste Video das ich hierzu gesehen habe. Und so viel besser nachvollziehbar, als wenn das Thema in Textform erklärt wird. Ich habe einige Abläufe durch dein Video das erste mal richtig nachvollziehen können! Super vielen Dank!

[@thenativeweb]

[gr] Das freut mich sehr, vielen, vielen Dank 😊

[@ElrondMcBong86]

Mein Prof meinte ja mal (zu "callbacks in node.js"), das Video sei vieeel zu lang, als ich es einer Kommilitonin empfohlen hatte. Aber genauso ists echt super, weil wirklich alles genau und nachvollziehbar ist und praktisch jeder wirklich alles versteht! Auch, wenn man vielleicht Grundsätzliches schon verstanden hat und noch mehr Details verstehen will ist das super! bester Kanal! :)

[@thenativeweb]

[gr] Das freut mich sehr, vielen Dank 😊

[@figae2]

Genau das haben wir getan, ohne zu wissen was wir tun. Schön, dass wir nun unseren eigenen Code verstehen. Danke für dieses Video!

[@thenativeweb]

[gr] Sehr gerne 😊

[@martinhovekamp8315]

Das ist ja eine super Agenda fürs Video. Das wird sicher vielen JS Entwicklern weiterhelfen und als "Nachschlagewerk" dienen. Nach der ersten Zeile "Asynchrone Programmierung" hatte ich gedacht : Oh - jetzt kommt "mit Go" .. aber es ist noch "mit Golo und JavaScript. Aber gut, vielleicht gibt ja später mal eine "Go" Variante und werde ich allein schon auf die Gesamtlänge des Videos schauen.

[@thenativeweb]

[gr] Danke schön 😊

[@christianhorauf9958]

Sehr, sehr schöne Zusammenfassung. 👍Was man evtl. noch hätte erwähnen können, überschreitet aber womöglich den Einstiegscharakter dieses Videos, ist dass man auch heute u.U. nicht auf Promises verzichten kann. Nämlich dann, wenn man beispielsweise mehrere asynchrone Aufrufe abwarten muss und deren Ergebnise dann mit Promise.all eingesammet werden müssen. @Golo: Du hast ja in Deinen Videos über Go mehrfach darauf hingewiesen wie einfach asynchrone Verarbeitung mit go im Vergleich zu JS ist. Vielleicht wäre auch mal ein Vergleichsvideo interessant, wo man komplexere asynchrone UseCases mal mit JS und mit Go löst um diese Vorteile herauszustellen. Vielen Dank. 😀

[@michaelrichter9408]

Eine geniale Zusammenfassung von asynchronen coden in JavaScript. Vielen Dank.

[@HolgerSchröder-g5c]

Du machst das ganz toll und ich kann dir stundenlang zuhören. Das einzige was mir Sorgen macht, ist der Inhalt der Blechdose, die du getrunken hast. Ist das ein Energydrink, quasi Zuckerwasser. Trink bitte Tee oder Wasser (gibt es auch mit Geschmack). Wir brauchen dich noch sehr lange!

[@nazguhd4623]

Hallo Golo, großartiges und sehr verständliches Video! Dankeschön!

[@martinheinrich4394]

So eine tolle Einführung! Du machst das echt super! Vielen Dank und wieder so!

[@thenativeweb]

[gr] Vielen, vielen Dank 😊

[@BariHeusken]

Vielen Dank für das Video! Das war mal wirklich nötig für mein Verständnis. Das ganze wäre nur noch zu toppen durch eine Abwandlung für Typescript! Nochmals vielen Dank! Nun ist mir vieles klarer geworden.

[@thenativeweb]

[gr] Das freut mich sehr, vielen Dank 😊

[@psychedelic-chi]

Vielen lieben Dank für deine ausführlichen Erläuterungen zu dem Thema, ein sehr gutes Video!

[@RonaldWBock]

War super lehrreich. Komplett mitprogrammiert und inhaltlich verstanden. Danke 😃

[@thenativeweb]

[gr] Sehr, sehr gerne 😊

[@woife0705]

Toller Überblick, danke dafür! Was ich mich an der Stelle frage, ob man wissen sollte/muss ob ein Callback nun synchron oder asynchron ausgeführt wird. Weil abhängig davon das Exception handling anders berücksichtigt werden muss(?) Außerdem habe ich mich gefragt, was so die best practices sind, wenn man eine Art Event handler implementiert (Man also eine Liste an registrierten Callbacks nacheinander aufruft). Darf ich die beim Auftreten des Events einfach in einer Schleife aufrufen, muss/sollte ich sie in einen try-catch wrappen, oder sollte ich sie sogar per process.nextTick erstmal in die Queue werfen? Fragen über Fragen 😅

[@winstonmisha]

Sehr informatives Video! Habe viel gelernt.

[@thenativeweb]

[gr] Das freut mich, vielen Dank 😊

[@mediainside4726]

Hallo Golo, wieder eine sehr fundierte und verständlichen Herleitung der Problematik zur asynchronen Programmierung mit JavaScript. Super und ganz herzlichern Dank. Wie auch die anderen Tutorials, werde ich es meinen Studenten weiter empfehlen. Wir experimentieren sehr mit der React-Bibliothek. Vielleicht hast du ja auch mal Zeit und Lust über deren Grundbausteine wie useState, useEffect, useRef, useLayoutEffect, useCallback ein aktuelles Video zu produzieren!?

[@michaelrichter9408]

Geniale Zusammenfassung, Vielen Dank.

[@thenativeweb]

[gr] Vielen lieben Dank 😊

[@nasenbar5417]

Sehr starkes Video, ich wollte hier mal trotz meines unseriösen Namens fragen, ob ihr Einsteiger grundsätzlich aufnehmen würdet. Ich werde meine Ausbildung wohl dieses Jahr abschließen (Fachinformatiker Anwendungsentwicklung). Liebe Grüße

[@thenativeweb]

[gr] Vielen Dank für das Lob 😊 Melde Dich einfach mal per E-Mail unter hello [at] thenativeweb [dot] io 😊

[@axadkrk]

Danke, und wieder bin ich ein stück besserer JS Coder geworden

[@schobihh2703]

super Erklärungen. Vielleicht aber etwas luftholen zwischendurch, damit man hinterherkommt.

[@saulgodman7872]

Perfekt wie immer! :)

[@thenativeweb]

[gr] Awwww 🥰

[@stefanbrandner9202]

Aber wenn ich alles in ein synchrones Konstrukt zwängen tue, warum brauch ich dann überhaupt asynchrone Funktionalität. Oder gibt es auch die Möglichkeit, Promises auf die asynchrone Reise zu schicken und am Ende wieder mit await einzusammeln, bevor das synchrone Programm weiter läuft?

[@thenativeweb]

[gr] Es ist gerade kein synchrones Konstrukt - es sieht nur so aus. Unter der Haube wird async / await vom Compiler wieder in die Variante mit den Promises umgebaut, ist also tatsächlich asynchron.

[@stefanbrandner9202]

Sehr angenehm, dass du dir die Mühe machst und Fragen im Chat beantwortest, auch wenn diese von Unwissenheit zeugen (wie bei mir). Daumen hoch.

[@thenativeweb]

@@stefanbrandner9202 [gr] Danke schön 😊 Ich versuch's zumindest, auch wenn es leider nicht immer klappt, was zum einen an der Zeit liegt, zum anderen aber auch daran, dass es etwas schwierig ist, auf KZbin mitzubekommen, wenn zB eine Antwort auf eine Antwort geschrieben wurde. Die Benachrichtigungen sind da, um es mal vorsichtig auszudrücken, suboptimal 😉

[@Foreversun33]

@@thenativeweb Das würde mich auch mal interessieren, wieso das ( die Benachrichtigungen ) so furchtbar schlecht umgesetzt ist.

[@oliverhenning8758]

Du sagst, dass await nicht synchron wartet. Aber das heißt doch, dass die Logausgabe in Zeile 10 bei einer längeren Kopieraktion schon vor der Fertigstellung erscheint, oder?

[@thenativeweb]

[gr] Nein, das war anders gemeint … Wenn Du einen synchronen Funktionsaufruf hast, dann wartet der Thread aktiv auf das Ergebnis. Das bedeutet, dass in der Zeit nichts anderes passiert. Dein Programm blockiert. Wenn Du auf einen asynchronen Aufruf mit await wartest, dann geht es zwar an dieser Stelle nicht weiter, bevor das Ergebnis zur Verfügung steht (weil await erst dann weiter macht, wenn das zu Grunde liegende Promise resolved oder rejected wurde), aber in der Zwischenzeit können andere (!) Funktionen ausgeführt werden. Wenn Du zum Beispiel regelmäßig mit setInterval einen Counter ausgeben lässt, läuft der nicht weiter, solange auf eine synchrone Rückgabe gewartet wird - bei einem await hingegen schon.

[@svenjodicke3129]

Top Erklärungen... Weiter so... Bin als Anfänger (ca. 9 Monate in JS/TS/ExpressJS u. VueJS u.v.m., ansonsten langjährige Erfahrung in embedded Softwaredesign C/C++ und diverse andere Sprachen) begeistert, der aber immerhin mit allen Punkten schon Berührungen hatte. Eines ist mir in Hinblick auf asynchroner Verarbeitung aufgefallen. Ich habe es zwar schon lösen können, aber vll habt ihr ja bessere Lösungen parat und meine ist nur eine Sublösung. Ich würde meine Lösung gar nicht erst vorstellen, sondern einfach das Problem schildern. Problem: Ich habe einen Baum, der hat diverse Properties und eines dieser Property ist eine ID des jeweiligen Blattes (Kindes). Mit dieser ID kann man Backend-Fragen stellen, zb. lassen sich Zusatzinfos zu diesem Blatt (Kind) erfragen, die so nicht in den Blattelementen des Baumes enthalten sind. Um diese Zusatzinfos nun für jedes Blattelement herauszubekommen und in die Blätter auch hinein legen zu können, müsste man sich ja jetzt rekursiv durchhangeln und diese asynchone Funktion zb. GetAdditionallyInfo() aufrufen. Meine Frage nun: Wie geht das geschickte Aufrufen asynchoner Funktionen, wenn diese selbst rekursiv aufgerufen werden. Also (bitte eher als Pseudocode lesen ;-) ): async function MyRecursiveFunction(var leaf: Object):Object{ const Info = await Server.GetAdditionallyInfo(leaf.ID); leaf.Info = Info; if(leaf.hasChildren){ leaf.properties.foreach((element)=>{ await MyRecursiveFunction(element.ID); // ich glaube das funktioniert so nicht, aber ich hoffe ich konnte das Problem skizzieren }) } } Die zweite Frage, wie funktioniert generell ASYNC AWAIT im Kontext mit Methoden von Klassen in JavaScript? Soweit ich weiß kann man Methoden das Schlüsselwort ASYNC nicht geben, also bei mir ging es zu mindestens nicht. Ich hoffe das war soweit ansatzweise verständlich...

[@woife0705]

Ich hab jetzt nicht Alles im Detail getestet, aber vielleicht ein par Gedanken zu deinen Fragen: - Bei rekursiven Aufrufen gibt es mMn keine großen Unterschiede zwischen synchron und asynchron. Also wenn es für deine Anwendung passt (Abbruchbedingung, Resourcen, ...) dann kann man das schon so machen. - forEach kann glaube ich (kurze Google Suche bestätigt das) nicht mit asynchronen Funktionen umgehen. Daher wird in dem Callback nicht wirklich auf das Promise gewartet. (Außerdem muss die Arrow-Function async sein) - Du könntest aber mit .map() deine Elemente in ein Array von Promises umwandeln und dann entweder mit Promise.all() oder in einer "normalen" For-Schleife nacheinander auf alle warten - In deinem Beispiel könntest du die Promises parallelisieren, in dem du erst alle Promises erzeugst und danach erst await darauf aufrufst. Die Promises fangen beim Erstellen direkt mit der Ausführung an. Ein Promis bleibt aber dann in seinem Endzustand (resolved/rejected). Daher ist es nicht schlimm, wenn du später await darauf aufrufst. Je nach Resourcen und weiteren Implementierungsdetails kann das aber auch unerwünscht sein.

[@Furz35]

Tolles Video ;-) Ich würde mir eher browsernahe Beispiele wünschen als Node.js. Gerade das blockieren der GUI ist ein häufiges Problem was man mit multithreading (Webworker) verhindern kann.

[@thenativeweb]

[gr] Danke für Dein Lob und Dein Feedback 😊

[@Xcf_341]

Heilige Scheiße hat dein Kanal einen Mehrwert!

[@pat_mueller]

Für mich die Königsdisziplin in der Programmierung Jedenfalls nicht Memory Management, Design Patterns oder Rekursion

[@BURAXON]

Gehts um Ajax?

[@thenativeweb]

[gr] Nein. Es geht um asynchronen Code (Callbacks, Promises, async/await, …).