Das asynchrone Ausführen von JavaScript kann Webseiten schneller machen, führt jedoch oft auch zu komplexem Code. Einen Ausweg bietet die Verwendung sogenannter Promises.
Beim Laden von Webseiten finden viele Prozesse und Aufrufe parallel statt. Manche Funktionen wie der Abruf bestimmter URLs oder Dateien werden asynchron ausgeführt, was zu komplexem Code führen kann. Besonders AJAX-Webseiten basieren auf Asynchronie. Der Vorteil: Die übrigen Prozesse müssen nicht warten, bis ein Aufruf abgeschlossen wurde. Für einen vereinfachten Umgang mit asynchronem JavaScript bietet sich die Verwendung so genannter Promises an. Auch Google empfiehlt Promises für asynchrone JavaScript-Requests im Developer Blog.
Eine Promise steht stellvertretend für eine Operation, die noch nicht abgeschlossen ist, aber für die Zukunft erwartet wird. Sie erlaubt die Zuordnung von Handlern zu den zukünftig zu erwartenden Erfolgen oder Misserfolgen von asynchronen Handlungen. Damit lassen sich asynchrone Methoden genau wie synchrone Methoden verwenden. Der Unterschied besteht darin, dass statt eines endgültigen Wertes eine Promise auf einen zukünftigen Wert zurückgeliert wird. Die Syntax von Promises ist wie folgt definiert:
new Promise(executor); new Promise(function(resolve, reject) { ... });
Ein Executor
-Funktionsobjekt kennt zwei Argumente: resolve
und reject
. Das erste Argument schließt die Promise ab, das zweite Argument lehnt sie ab. Eine Promise kann drei Zustände besitzen:
pending
: Ausgangsposition; noch nicht abgeschlossen (fulfilled
) oder abgelehnt (rejected
)fulfilled
: Die Operation wurde erfolgreich abgeschlossen.rejected
: Die Operation ist fehlgeschlagen.
Nach dem erfolgreichen Abschluss oder dem Scheitern einer Operation werden die Handler aufgerufen, die von der zugehörigen then
-Methode eingeplant sind. Auf diese Weise lassen sich asynchrone Prozesse aneinanderketten:
Wer sich näher mit Promises beschäftigen möchte, hat die Möglichkeit, einen Online-Kurs zu besuchen. Dafür muss etwa ein Tag investiert werden.
Titelbild © maciek905 - Fotolia.com