3.1 Erstellen von Promise-Ketten
Promise-Ketten erlauben es dir, mehrere asynchrone Operationen nacheinander auszuführen, indem du das Ergebnis einer Operation an die nächste weitergibst. Dadurch wird der Code lesbarer und besser handhabbar. Außerdem bieten Promises leistungsstarke Möglichkeiten zur Fehlerbehandlung, was es ermöglicht, zuverlässige und fehlertolerante Anwendungen zu erstellen.
Grundkonzept
Eine Promise-Kette wird durch die Rückgabe eines neuen Promises aus der then-Methode erstellt. Jede then-Methode
gibt ein neues Promise zurück, was es ermöglicht, sequentielle asynchrone Operationen zu strukturieren.
Beispiel einer einfachen Promise-Kette
In diesem Beispiel führt jede then-Methode ihre eigene Operation aus und übergibt das Ergebnis an die nächste then-Methode weiter.
const promise = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('Schritt 1 abgeschlossen');
}, 1000);
});
promise
.then((result) => {
console.log(result); // Gibt aus: Schritt 1 abgeschlossen
return 'Schritt 2 abgeschlossen';
})
.then((result) => {
console.log(result); // Gibt aus: Schritt 2 abgeschlossen
return 'Schritt 3 abgeschlossen';
})
.then((result) => {
console.log(result); // Gibt aus: Schritt 3 abgeschlossen
})
.catch((error) => {
console.error(error);
});
Beispiel einer Kette mit asynchronen Operationen
In diesem Beispiel wartet jede then-Methode darauf, dass die asynchrone Operation abgeschlossen ist, bevor der nächste Schritt ausgeführt wird:
function asyncOperation(step) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(`${step} abgeschlossen`);
}, 1000);
});
}
asyncOperation('Schritt 1')
.then((result) => {
console.log(result); // Gibt aus: Schritt 1 abgeschlossen
return asyncOperation('Schritt 2');
})
.then((result) => {
console.log(result); // Gibt aus: Schritt 2 abgeschlossen
return asyncOperation('Schritt 3');
})
.then((result) => {
console.log(result); // Gibt aus: Schritt 3 abgeschlossen
})
.catch((error) => {
console.error(error);
});
3.2 Fehlerbehandlung in Promise-Ketten
Die catch-Methode wird zur Fehlerbehandlung in einer Promise-Kette verwendet. Wenn in einem der Promises ein Fehler auftritt,
wird dieser an die nächste catch-Methode weitergeleitet. Dies ermöglicht eine zentrale Fehlerbehandlung und verbessert die Lesbarkeit
und Wartung des Codes.
Beispiel der Fehlerbehandlung
In diesem Beispiel wird der Fehler, der in Schritt 2 auftritt, von der catch-Methode abgefangen,
und die nachfolgenden then-Methoden werden nicht ausgeführt:
function asyncOperation(step, shouldFail = false) {
return new Promise((resolve, reject) => {
setTimeout(() => {
if (shouldFail) {
reject(`${step} fehlgeschlagen`);
} else {
resolve(`${step} abgeschlossen`);
}
}, 1000);
});
}
asyncOperation('Schritt 1')
.then((result) => {
console.log(result);
return asyncOperation('Schritt 2', true); // Diese Operation wird fehlschlagen
})
.then((result) => {
console.log(result); // Dieser Code wird nicht ausgeführt
return asyncOperation('Schritt 3');
})
.then((result) => {
console.log(result); // Dieser Code wird nicht ausgeführt
})
.catch((error) => {
console.error('Fehler:', error); // Gibt aus: Fehler: Schritt 2 fehlgeschlagen
});
Fehlerbehandlung in bestimmten Schritten
Manchmal ist es notwendig, Fehler in bestimmten Schritten der Kette zu behandeln, ohne die gesamte Kette zu unterbrechen.
Dafür können verschachtelte then- und catch-Methoden verwendet werden.
Beispiel der Fehlerbehandlung in bestimmten Schritten
In diesem Beispiel wird der Fehler in Schritt 2 lokal behandelt, und die Kette wird mit einem wiederhergestellten Wert fortgesetzt:
function asyncOperation(step, shouldFail = false) {
return new Promise((resolve, reject) => {
setTimeout(() => {
if (shouldFail) {
reject(`${step} fehlgeschlagen`);
} else {
resolve(`${step} abgeschlossen`);
}
}, 1000);
});
}
asyncOperation('Schritt 1')
.then((result) => {
console.log(result);
return asyncOperation('Schritt 2', true).catch((error) => {
console.warn('Behandelter Fehler in Schritt 2:', error);
return 'Erholung nach Fehler in Schritt 2';
});
})
.then((result) => {
console.log(result); // Gibt aus: Erholung nach Fehler in Schritt 2
return asyncOperation('Schritt 3');
})
.then((result) => {
console.log(result); // Gibt aus: Schritt 3 abgeschlossen
})
.catch((error) => {
console.error('Fehler:', error); // Dieser Code wird nicht ausgeführt
});
3.3 Verwendung von finally
Die finally-Methode wird verwendet, um Code auszuführen, unabhängig davon, ob ein Promise erfolgreich abgeschlossen oder fehlgeschlagen ist.
Dies ist nützlich für abschließende Aktionen wie das Freigeben von Ressourcen.
Beispiel der Verwendung von finally:
function asyncOperation(step, shouldFail = false) {
return new Promise((resolve, reject) => {
setTimeout(() => {
if (shouldFail) {
reject(`${step} fehlgeschlagen`);
} else {
resolve(`${step} abgeschlossen`);
}
}, 1000);
});
}
asyncOperation('Schritt 1')
.then((result) => {
console.log(result);
return asyncOperation('Schritt 2');
})
.then((result) => {
console.log(result);
return asyncOperation('Schritt 3');
})
.catch((error) => {
console.error('Fehler:', error);
})
.finally(() => {
console.log('Alle Operationen abgeschlossen'); // Wird auf jeden Fall ausgeführt
});
In diesem Beispiel wird die finally-Methode in jedem Fall ausgeführt, unabhängig davon, ob ein Fehler aufgetreten ist oder nicht.
GO TO FULL VERSION