Ebben az oktatóanyagban példák segítségével megismerheti a JavaScript visszahívási funkcióit.
A függvény egy kódblokk, amely meghíváskor bizonyos feladatot hajt végre. Például,
// function function greet(name) ( console.log('Hi' + ' ' + name); ) greet('Peter'); // Hi Peter
A fenti programban egy string értéket adunk át argumentumként a greet()
függvénynek.
A JavaScript-ben egy függvényt argumentumként is átadhat egy függvénynek. Ezt a függvényt, amelyet argumentumként adunk át egy másik függvényen belül, visszahívási függvénynek nevezzük. Például,
// 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);
Kimenet
Szia Peter visszahívó funkció vagyok
A fenti programban két funkció van. A greet()
függvény meghívása közben két argumentum (egy karakterlánc és egy függvény) kerül átadásra.
A callMe()
funkció visszahívási funkció.
A visszahívási funkció előnyei
A visszahívási funkció használatának előnye, hogy megvárhatja az előző függvényhívás eredményét, majd végrehajthat egy másik függvényhívást.
Ebben a példában a setTimeout()
metódust arra fogjuk használni, hogy utánozzuk azt a programot, amelynek végrehajtása időbe telik, például a szerverről érkező adatokat.
Példa: A setTimeout () program
// 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');
Kimenet
Hello John Hello világ
Mint tudják, a setTimeout () metódus a megadott idő után végrehajt egy kódblokkot.
Itt a greet()
függvény 2000 milliszekundum ( 2 másodperc) után hívódik meg . Ez alatt a várakozás alatt a sayName('John');
program végrehajtásra kerül. Ezért a Hello John-t a Hello world előtt nyomtatják.
A fenti kód aszinkron módon kerül végrehajtásra (a második függvény; sayName()
nem várja meg az első függvény greet()
befejezését).
Példa: Visszahívási funkció használata
A fenti példában a második függvény nem várja meg az első függvény befejezését. Ha azonban a következő utasítás végrehajtása előtt meg akarja várni az előző függvényhívás eredményét, használhat egy visszahívási funkciót. Például,
// 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);
Kimenet
Helló világ Helló John
A fenti programban a kódot szinkron módon hajtják végre. A sayName()
függvény argumentumként továbbadódik a greet()
függvénynek.
A setTimeout()
módszer greet()
csak 2 másodperc múlva hajtja végre a funkciót . A sayName()
függvény azonban megvárja a függvény végrehajtását greet()
.
Megjegyzés : A visszahívási funkció hasznos, ha várnia kell egy időigényes eredményre. Például a szerverről érkező adatok, mert időbe telik az adatok megérkezése.