Sascha Schulz
2023-05-23 0d09af2d85db61835968a00c8349610c9aaabe76
continue Promises and async-await
1 Dateien geändert
153 ■■■■■ Geänderte Dateien
index.html 153 ●●●●● Patch | Ansicht | Raw | Blame | Historie
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>