In diesem Tutorial lernen Sie anhand von Beispielen die JavaScript-Rückruffunktionen kennen.
Eine Funktion ist ein Codeblock, der beim Aufruf eine bestimmte Aufgabe ausführt. Beispielsweise,
// function function greet(name) ( console.log('Hi' + ' ' + name); ) greet('Peter'); // Hi Peter
Im obigen Programm wird ein Zeichenfolgenwert als Argument an die greet()Funktion übergeben.
In JavaScript können Sie einer Funktion auch eine Funktion als Argument übergeben. Diese Funktion, die als Argument innerhalb einer anderen Funktion übergeben wird, wird als Rückruffunktion bezeichnet. Beispielsweise,
// function function greet(name, callback) ( console.log('Hi' + ' ' + name); callback(); ) // callback function function callMe() ( console.log('I am callback function'); ) // passing function as an argument greet('Peter', callMe);
Ausgabe
Hallo Peter ich bin Rückruffunktion
Im obigen Programm gibt es zwei Funktionen. Beim Aufruf der greet()Funktion werden zwei Argumente (ein Zeichenfolgenwert und eine Funktion) übergeben.
Die callMe()Funktion ist eine Rückruffunktion.
Vorteil der Rückruffunktion
Die Verwendung einer Rückruffunktion bietet den Vorteil, dass Sie auf das Ergebnis eines vorherigen Funktionsaufrufs warten und dann einen weiteren Funktionsaufruf ausführen können.
In diesem Beispiel verwenden wir die setTimeout()Methode, um das Programm nachzuahmen, dessen Ausführung einige Zeit in Anspruch nimmt, z. B. Daten, die vom Server stammen.
Beispiel: Programm mit setTimeout ()
// program that shows the delay in execution function greet() ( console.log('Hello world'); ) function sayName(name) ( console.log('Hello' + ' ' + name); ) // calling the function setTimeout(greet, 2000); sayName('John');
Ausgabe
Hallo John Hallo Welt
Wie Sie wissen, führt die Methode setTimeout () nach der angegebenen Zeit einen Codeblock aus.
Hier wird die greet()Funktion nach 2000 Millisekunden ( 2 Sekunden) aufgerufen . Während dieser Wartezeit wird das sayName('John');ausgeführt. Deshalb wird Hello John vor Hello World gedruckt.
Der obige Code wird asynchron ausgeführt (die zweite Funktion; sayName()wartet nicht auf die erste Funktion; wird greet()abgeschlossen).
Beispiel: Verwenden einer Rückruffunktion
Im obigen Beispiel wartet die zweite Funktion nicht auf den Abschluss der ersten Funktion. Wenn Sie jedoch auf das Ergebnis des vorherigen Funktionsaufrufs warten möchten, bevor die nächste Anweisung ausgeführt wird, können Sie eine Rückruffunktion verwenden. Beispielsweise,
// Callback Function Example function greet(name, myFunction) ( console.log('Hello world'); // callback function // executed only after the greet() is executed myFunction(name); ) // callback function function sayName(name) ( console.log('Hello' + ' ' + name); ) // calling the function after 2 seconds setTimeout(greet, 2000, 'John', sayName);
Ausgabe
Hallo Welt Hallo John
Im obigen Programm wird der Code synchron ausgeführt. Die sayName()Funktion wird als Argument an die greet()Funktion übergeben.
Die setTimeout()Methode führt die greet()Funktion erst nach 2 Sekunden aus. Die sayName()Funktion wartet jedoch auf die Ausführung der greet()Funktion.
Hinweis : Die Rückruffunktion ist hilfreich, wenn Sie auf ein Ergebnis warten müssen, das einige Zeit in Anspruch nimmt. Zum Beispiel die Daten, die von einem Server kommen, weil es einige Zeit dauert, bis Daten eintreffen.
