I denna handledning lär du dig om JavaScript-återuppringningsfunktioner med hjälp av exempel.
En funktion är ett kodblock som utför en viss uppgift när den anropas. Till exempel,
// function function greet(name) ( console.log('Hi' + ' ' + name); ) greet('Peter'); // Hi Peter
I ovanstående program skickas ett strängvärde som ett argument till greet()funktionen.
I JavaScript kan du också skicka en funktion som ett argument till en funktion. Denna funktion som skickas som ett argument inuti en annan funktion kallas en återuppringningsfunktion. Till exempel,
// 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);
Produktion
Hej Peter, jag är återuppringningsfunktion
I ovanstående program finns det två funktioner. När du anropar greet()funktionen skickas två argument (ett strängvärde och en funktion).
Den callMe()funktionen är en callback-funktion.
Fördel med återuppringningsfunktion
Fördelen med att använda en återuppringningsfunktion är att du kan vänta på resultatet av ett tidigare funktionssamtal och sedan utföra ett nytt funktionsanrop.
I det här exemplet ska vi använda setTimeout()metoden för att efterlikna programmet som tar tid att köra, till exempel data som kommer från servern.
Exempel: Program med 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');
Produktion
Hej John Hej värld
Som du vet kör metoden setTimeout () ett kodblock efter den angivna tiden.
Här greet()kallas funktionen efter 2000 millisekunder ( 2 sekunder). Under denna väntan sayName('John');körs den. Det är därför Hello John skrivs ut innan Hello world.
Ovanstående kod exekveras asynkront (den andra funktionen; sayName()väntar inte på den första funktionen; greet()att slutföra).
Exempel: Använda en återuppringningsfunktion
I exemplet ovan väntar inte den andra funktionen på att den första funktionen ska vara klar. Men om du vill vänta på resultatet av föregående funktionsanrop innan nästa uttalande utförs kan du använda en återuppringningsfunktion. Till exempel,
// 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);
Produktion
Hej värld Hej John
I ovanstående program körs koden synkront. Den sayName()funktionen skickas som ett argument till greet()funktionen.
Den setTimeout()metod exekverar greet()funktionen endast efter 2 sekunder. Men sayName()väntar funktion för utförandet av greet()funktionen.
Obs! Återuppringningsfunktionen är till hjälp när du måste vänta på ett resultat som tar tid. Till exempel data som kommer från en server eftersom det tar tid för data att komma fram.
