Asynchrone Programmierung in JavaScript in 80 Minuten // deutsch

Поділитися
Вставка
  • Опубліковано 29 вер 2024

КОМЕНТАРІ • 60

  • @orange-vlcybpd2
    @orange-vlcybpd2 2 роки тому +15

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

    • @thenativeweb
      @thenativeweb  2 роки тому +1

      [gr] Vielen lieben Dank 😊

    • @cgsman1
      @cgsman1 2 роки тому +1

      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!

  • @kastenkarsten
    @kastenkarsten 2 роки тому +6

    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.

  • @schneider.mariane
    @schneider.mariane 2 роки тому +9

    Ü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.

  • @christianhorauf9958
    @christianhorauf9958 2 роки тому +2

    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. 😀

  • @wassagtmanndazu
    @wassagtmanndazu 2 роки тому +4

    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
      @thenativeweb  2 роки тому

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

  • @martinhovekamp8315
    @martinhovekamp8315 2 роки тому +4

    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.

  • @ElrondMcBong86
    @ElrondMcBong86 2 роки тому +4

    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
      @thenativeweb  2 роки тому

      [gr] Das freut mich sehr, vielen Dank 😊

  • @MarkusEicher70
    @MarkusEicher70 2 роки тому +3

    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
      @thenativeweb  2 роки тому

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

  • @nasenbar5417
    @nasenbar5417 2 роки тому +1

    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
      @thenativeweb  2 роки тому +1

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

  • @oliverhenning8758
    @oliverhenning8758 2 роки тому +1

    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
      @thenativeweb  2 роки тому +1

      [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.

  • @HolgerSchröder-g5c
    @HolgerSchröder-g5c 7 місяців тому

    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!

  • @schobihh2703
    @schobihh2703 6 місяців тому

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

  • @pat_mueller
    @pat_mueller Рік тому

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

  • @winstonmisha
    @winstonmisha Рік тому +1

    Sehr informatives Video! Habe viel gelernt.

  • @mediainside4726
    @mediainside4726 2 роки тому +1

    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!?

  • @psychedelic-chi
    @psychedelic-chi Рік тому

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

  • @boothtml9069
    @boothtml9069 2 роки тому +2

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

  • @stefanbrandner9202
    @stefanbrandner9202 Рік тому +1

    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
      @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
      @stefanbrandner9202 Рік тому +1

      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
      @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 UA-cam mitzubekommen, wenn zB eine Antwort auf eine Antwort geschrieben wurde. Die Benachrichtigungen sind da, um es mal vorsichtig auszudrücken, suboptimal 😉

    • @Foreversun33
      @Foreversun33 Рік тому

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

  • @figae2
    @figae2 2 роки тому +2

    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!

  • @axadkrk
    @axadkrk Рік тому

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

  • @BariHeusken
    @BariHeusken 2 роки тому +1

    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
      @thenativeweb  2 роки тому +1

      [gr] Das freut mich sehr, vielen Dank 😊

  • @Furz35
    @Furz35 2 роки тому +1

    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
      @thenativeweb  2 роки тому

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

  • @RonaldWBock
    @RonaldWBock Рік тому +1

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

  • @saminar311
    @saminar311 Рік тому

    Heilige Scheiße hat dein Kanal einen Mehrwert!

  • @martinheinrich4394
    @martinheinrich4394 Рік тому +1

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

  • @woife0705
    @woife0705 2 роки тому

    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 😅

  • @nazguhd4623
    @nazguhd4623 Рік тому

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

  • @michaelrichter9408
    @michaelrichter9408 2 роки тому

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

  • @wassagtmanndazu
    @wassagtmanndazu 2 роки тому +2

    Danke!

  • @michaelrichter9408
    @michaelrichter9408 2 роки тому +1

    Geniale Zusammenfassung, Vielen Dank.

  • @svenjodicke3129
    @svenjodicke3129 2 роки тому

    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
      @woife0705 2 роки тому +1

      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.

  • @saulgodman7872
    @saulgodman7872 2 роки тому +1

    Perfekt wie immer! :)

  • @BURAXON
    @BURAXON Рік тому

    Gehts um Ajax?

    • @thenativeweb
      @thenativeweb  Рік тому

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