From 0d09af2d85db61835968a00c8349610c9aaabe76 Mon Sep 17 00:00:00 2001 From: Sascha Schulz <sschulz@dh-software.de> Date: Di, 23 Mai 2023 16:17:47 +0200 Subject: [PATCH] continue Promises and async-await --- index.html | 153 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 153 insertions(+), 0 deletions(-) diff --git a/index.html b/index.html index 788f36d..88584f9 100644 --- a/index.html +++ b/index.html @@ -1642,6 +1642,159 @@ </code> </pre> </section> + <section> + Lösung: + <pre> + <code class="js" data-trim data-line-numbers> + const delay = function(ms) { + return new Promise(function(resolve, reject) { + setTimeout(function() { + resolve(); + }, ms); + }); + } + + console.log("erster"); + + delay(2000) + .then(function () { + console.log("zweiter"); + + return delay(2000); + }) + .then(function() { + console.log("Text A"); + + return delay(2000); + }) + .then(function() { + console.log("Text B"); + }) + </code> + </pre> + </section> + <section> + Rückgabewerte mit Promises + <pre> + <code class="js" data-trim data-line-numbers> + const p = new Promise(function(resolve, reject) { + resolve("ok"); + }); + + p.then(function(value) { + console.log(value); + }); + </code> + </pre> + <pre> + <code class="bash" data-trim data-line-numbers> + ok + </code> + </pre> + </section> + <section> + Fehlerbehandlung mit Promises + <pre> + <code class="js" data-trim data-line-numbers> + const p = new Promise(function(resolve, reject) { + reject(new Error("Fehler")); + }); + + p + .then(function() { + console.log("Ich werde nicht aufgerufen") + }) + .catch(function(e) { + console.log(e.message); + }); + </code> + </pre> + <pre> + <code class="bash" data-trim data-line-numbers> + Fehler + </code> + </pre> + </section> + <section> + Datei lesen mit NodeJS + <pre> + <code class="js" data-trim data-line-numbers> + const fs = require("fs"); + + fs.readFile("./hello.txt", {encoding: "utf8"}, function(data) { + console.log(data); + }); + </code> + </pre> + <pre> + <code class="bash" data-trim data-line-numbers> + Hello World! + + </code> + </pre> + </section> + <section> + Aufgabe: "Promisifiziere" analog zu "delay" in der letzten Aufgabe den Aufruf von fs.readFile() + <pre> + <code class="js" data-trim data-line-numbers> + const fs = require("fs"); + + function readFile() { + // implementieren + } + + readFile.then(function(content) { + console.log(content); + }); + </code> + </pre> + <pre> + <code class="bash" data-trim data-line-numbers> + Hello World! + </code> + </pre> + </section> + <section> + Aufgabe: Nutze die vorherige Lösung nun für eine Promise-Kette, sodass die Inhalte der zwei Dateien "hello.txt" und "hallo.txt" nacheinander ausgegeben werden: + <pre> + <code class="bash" data-trim data-line-numbers> + Hello World! + + Hallo Welt! + + </code> + </pre> + </section> + <section> + <h3>Async - Await</h3> + <ul> + <li>Syntaktischer Zucker für Promises</li> + <li>Nutzung von <code>await</code> nur im Kontext einer <code>async</code>-Funktion möglich</li> + </ul> + <pre> + <code class="js" data-trim data-line-numbers> + async function wrapper() { + const p = new Promise(function(resolve, reject) { + resolve("Hello from Promise!"); + }); + + const result = await p; + + console.log(result); + } + + wrapper(); + </code> + </pre> + <pre> + <code class="bash" data-trim data-line-numbers> + Hello from Promise! + </code> + </pre> + </section> + <section> + Aufgabe: Schreibe die Lösung der vorherigen Aufgabe nach Async - Await um + </section> </section> </div> </div> -- Gitblit v1.9.3