Quiz: 9 JavaScript‑Promise‑Fragen
Versprechen nie wieder fallen lassen!
Kennst du JavaScript‑Promises?
- Beweise deine JavaScript‑Skills! 🚀
- Hinweise prüfen (großer Button, untere Ecke).
- Probiere den Code in der Browser‑Konsole aus (Tastenkürzel
F12oder Suche) oder nutze repl.it*. - Gerne kannst du mir auf Twitter @justsml schreiben. Ich freue mich auf dein Feedback!
👇 Löse die 9 Fragen unten 👇
Wie lautet die Ausgabe des folgenden Codes?
var p = new Promise((resolve, reject) => { reject(Error('The Fails!'))})p.catch(error => console.log(error.message))p.catch(error => console.log(error.message))Wir erstellen ein Promise mit der Konstruktor‑Methode und lösen sofort einen Fehler über den reject‑Callback aus.
Dann funktionieren die .catch‑Handler ähnlich wie .addEventListener(event, callback) im DOM oder .on(event, callback) beim Event Emitter, wobei mehrere Handler‑Callbacks hinzugefügt werden können. Jeder wird mit denselben Argumenten aufgerufen.
Wie lautet die Ausgabe für den folgenden Code?
var p = new Promise((resolve, reject) => { return Promise.reject(Error('The Fails!'))})p.catch(error => console.log(error.message))p.catch(error => console.log(error.message))Wenn du den Promise‑Konstruktor verwendest, musst du entweder die resolve()‑ oder die reject()‑Callbacks aufrufen. Der Promise‑Konstruktor ignoriert den Rückgabewert des Executors, sodass die zusätzlich mit Promise.reject() erstellte Promise nicht an p angehängt wird. Die beiden Handler werden an p angehängt, das im Pending‑Zustand bleibt, während die zurückgegebene abgelehnte Promise vom Host‑Umfeld als unbehandelt gemeldet wird.
Wie lautet die Ausgabe des folgenden Codes?
var p = new Promise((resolve, reject) => { reject(Error('The Fails!'))}).catch(error => console.log(error)).then(error => console.log(error))Beim Verketten von .then- und .catch-Aufrufen ist es hilfreich, sie als Reihe von Schritten zu betrachten. Jeder .then erhält den von dem vorherigen .then zurückgegebenen Wert (als Argument). Wenn jedoch dein „Schritt“ einen Fehler verursacht, werden alle nachfolgenden .then‑„Schritte“ übersprungen, bis ein .catch gefunden wird. Möchtest du einen Fehler überschreiben, musst du einfach einen Nicht‑Fehler‑Wert zurückgeben. Dieser kann dann in jedem nachfolgenden .then verwendet werden.
Wie lautet die Ausgabe für den folgenden Code?
var p = new Promise((resolve, reject) => { reject(Error('The Fails!'))}).catch(error => console.log(error.message)).catch(error => console.log(error.message))Beim Verketten von .catchs behandelt jeder nur Fehler, die in vorherigen .then‑ oder .catch‑„Schritten“ geworfen wurden. In diesem Beispiel gibt der erste .catch das console.log zurück, das nur über ein nach beiden .catchs hinzugefügtes .then() zugänglich ist.
Wie lautet die Ausgabe des folgenden Codes?
new Promise((resolve, reject) => { resolve('Success!') }) .then(() => { throw Error('Oh noes!') }) .catch(error => { return "actually, that worked" }) .catch(error => console.log(error.message))Hinweis: .catchs können verwendet werden, um Fehler zu ignorieren (oder zu überschreiben), indem einfach ein regulärer Wert zurückgegeben wird.
Dieser Trick funktioniert nur, wenn ein nachfolgendes .then den Wert empfängt.
Wie lautet die Ausgabe für den folgenden Code?
Promise.resolve('Success!') .then(data => { return data.toUpperCase() }) .then(data => { console.log(data) })Hinweis: .thens geben Daten sequenziell weiter, vom return value zum nächsten .then(value => /* handle value */).
Ein return ist entscheidend, um einen Wert an den nächsten .then zu übergeben.
Wie lautet die Ausgabe des folgenden Codes?
Promise.resolve('Success!') .then(data => { return data.toUpperCase() }) .then(data => { console.log(data) return data }) .then(console.log)Es gibt 2 console.log‑Aufrufe, die ausgeführt werden.
Wie lautet die Ausgabe für den folgenden Code?
Promise.resolve('Success!') .then(data => { data.toUpperCase() }) .then(data => { console.log(data) })Hinweis: .then-Aufrufe geben Daten sequenziell weiter, von return value zum nächsten .then(value => /* handle value */).
Ein return ist entscheidend, um einen Wert an den nächsten .then zu übergeben.
Wie lautet die Ausgabe des folgenden Codes?
Promise.resolve('Success!') .then(() => { throw Error('Oh noes!') }) .catch(error => { return 'actually, that worked' }) .then(data => { throw Error('The fails!') }) .catch(error => console.log(error.message))