Callback-Funktionen in JavaScript

In JavaScript können Programmierer Codeeinheiten einschließlich Variablen und Funktionen definieren. JavaScript-Funktionen können auch Parameter empfangen, wobei der Code, der eine Funktion aufruft, diese Parameter entweder als Variablen oder als Werte übergibt. Es ist auch möglich, als Parameter eine Referenz auf eine andere Funktion zu übergeben. Eine Callback-Funktion wird normalerweise aufgerufen, wenn die Ausführung einer anderen Funktion abgeschlossen ist. Aus diesem Grund erscheinen Callback-Funktionen oft als Parameter anderer Funktionen.

Rückruf-Definition

Um eine Callback-Funktion zu implementieren, muss der JavaScript-Code in einer Seite zuerst die Funktion definieren. Der folgende Beispielcode definiert eine Funktion und speichert einen Variablenverweis darauf: var callbackDefinition = function(numParam) { alert(numParam); };

Die Funktion verwendet einen numerischen Parameter zur Demonstration. Die Callback-Funktion kann jeden JavaScript-Code enthalten, den eine Standardfunktion enthalten könnte. Der Code kann nun unter Verwendung des Variablennamens eine Referenz auf die Funktion als Parameter an eine andere Funktion übergeben.

Rückrufparameter

Sobald ein Skript eine Funktion als Variable definiert hat, kann es diese Variable als Parameter an eine andere Funktion übergeben. Der folgende Beispielcode demonstriert die Technik: mainFunction(10, callbackDefinition);

Dieser Code ruft eine benannte Funktion auf, wobei ein Zahlenparameter und der Name der Variablen übergeben werden, die den Callback-Funktionscode speichert. Die Gliederung der hier aufgerufenen Funktion muss mit diesen beiden Parametern übereinstimmen. Die Funktion, die die Callback-Variable empfängt, kann die gespeicherte Funktion aufrufen.

Funktionsausführung

Nach der Übergabe an die Hauptfunktion kann eine Callback-Funktion ausgeführt werden. Der folgende Beispielcode demonstriert: function mainFunction(myNum, callbackFn) { alert(myNum); callbackFn(myNum*2); }

Zur Demonstration gibt dieser Code zunächst eine JavaScript-Warnung aus, die dazu führt, dass ein Dialogfeld im Browser des Benutzers angezeigt wird. Sobald dieser Code ausgeführt wird, ruft die Funktion die Callback-Funktion unter Verwendung des als Parameter angegebenen Namens auf. Der Callback-Funktionsaufruf enthält einen numerischen Parameter, der von der ursprünglich als Variable definierten Funktion erwartet wird.

Funktionsaufruf

Sobald eine Seite eine Funktion einschließlich eines Callbacks definiert hat, kann sie diesen Code ausführen. Häufig weisen Entwickler den Browser an, auf ein Benutzerereignis zu warten und in diesem Fall Funktionen auszuführen. Der folgende HTML-Code ruft beispielsweise eine Funktion auf: Hier ist ein anklickbarer Abschnitt

Wenn die als Parameter angegebene Funktion die Callback-Variablendefinition und den Aufruf der Hauptfunktion enthält, erzeugt dies den Callback-Effekt wie folgt: function doCallback() { var callFn = function(numParam) { alert(numParam); }; mainFunction(10, callFn); }

Sobald die main-Funktion ihren eigenen Codeinhalt ausführt, ruft sie die Callback-Funktion auf.