V tomto tutoriáli sa pomocou príkladov dozviete o funkciách spätného volania JavaScriptu.
Funkcia je blok kódu, ktorý pri volaní vykoná určitú úlohu. Napríklad,
// function function greet(name) ( console.log('Hi' + ' ' + name); ) greet('Peter'); // Hi Peter
Vo vyššie uvedenom programe je hodnota reťazca odovzdaná ako argument greet()
funkcii.
V JavaScripte môžete funkcii tiež odovzdať funkciu ako argument. Táto funkcia, ktorá sa odovzdáva ako argument vo vnútri inej funkcie, sa nazýva funkcia spätného volania. Napríklad,
// 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);
Výkon
Ahoj Peter, som funkcia spätného volania
Vo vyššie uvedenom programe sú dve funkcie. Pri volaní greet()
funkcie sú odovzdané dva argumenty (hodnota reťazca a funkcia).
Táto callMe()
funkcia je funkcia spätného volania.
Výhoda funkcie spätného volania
Výhodou použitia funkcie spätného volania je, že môžete počkať na výsledok predchádzajúceho volania funkcie a potom vykonať ďalšie volanie funkcie.
V tomto príklade použijeme setTimeout()
metódu na napodobnenie programu, ktorého vykonanie si vyžaduje čas, napríklad údajov pochádzajúcich zo servera.
Príklad: Program s 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');
Výkon
Ahoj John Ahoj svet
Ako viete, metóda setTimeout () vykoná blok kódu po stanovenom čase.
Tu sa greet()
funkcia volá po 2 000 milisekundách ( 2 sekundách). Počas tohto čakania sayName('John');
sa vykoná. Preto je Hello John vytlačený pred Hello world.
Vyššie uvedený kód sa vykonáva asynchrónne (druhá funkcia; sayName()
nečaká na dokončenie prvej funkcie; greet()
dokončenie).
Príklad: Použitie funkcie spätného volania
Vo vyššie uvedenom príklade druhá funkcia nečaká na dokončenie prvej funkcie. Ak však chcete počkať na výsledok predchádzajúceho volania funkcie pred vykonaním ďalšieho príkazu, môžete použiť funkciu spätného volania. Napríklad,
// 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);
Výkon
Ahoj svet Ahoj John
Vo vyššie uvedenom programe sa kód vykonáva synchrónne. sayName()
Funkcia je odovzdaný ako argument do greet()
funkcie.
setTimeout()
Metóda vykonáva greet()
funkciu iba do 2 sekundách. Avšak sayName()
funkcie čaká na vykonanie danej greet()
funkcie.
Poznámka : Funkcia spätného volania je užitočná, keď musíte čakať na výsledok, ktorý si vyžaduje čas. Napríklad dáta pochádzajúce zo servera, pretože kým prídu dáta, nejaký čas to trvá.