В този урок ще научите за функциите за обратно извикване на JavaScript с помощта на примери.
Функцията е блок от код, който изпълнява определена задача при извикване. Например,
// function function greet(name) ( console.log('Hi' + ' ' + name); ) greet('Peter'); // Hi Peter
В горната програма низова стойност се предава като аргумент на greet()функцията.
В JavaScript можете също да предадете функция като аргумент на функция. Тази функция, която се предава като аргумент вътре в друга функция, се нарича функция за обратно извикване. Например,
// 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);
Изход
Здравей, Петър, аз съм функция за обратно извикване
В горната програма има две функции. Докато се извиква greet()функцията, се предават два аргумента (стойност на низ и функция).
На callMe()функцията е функция обаждане.
Предимство на функцията за обратно извикване
Ползата от използването на функция за обратно извикване е, че можете да изчакате резултата от предишно повикване на функция и след това да изпълните друго повикване на функция.
В този пример ще използваме setTimeout()метода, за да имитираме програмата, която отнема време за изпълнение, като данни, идващи от сървъра.
Пример: Програма с 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');
Изход
Здравей Джон Здравей свят
Както знаете, методът setTimeout () изпълнява блок от код след определеното време.
Тук greet()функцията се извиква след 2000 милисекунди ( 2 секунди). По време на това изчакване sayName('John');се изпълнява. Ето защо Hello John е отпечатан преди Hello world.
Горният код се изпълнява асинхронно (втората функция; sayName()не чака първата функция; greet()да завърши).
Пример: Използване на функция за обратно повикване
В горния пример втората функция не чака първата функция да бъде завършена. Ако обаче искате да изчакате резултата от предишното извикване на функция, преди да бъде изпълнено следващото извлечение, можете да използвате функция за обратно извикване. Например,
// 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);
Изход
Здравей свят Здравей Джон
В горната програма кодът се изпълнява синхронно. Най- sayName()функцията се предава като аргумент на greet()функцията.
В setTimeout()метода изпълнява greet()функцията само след 2 секунди. Въпреки това, sayName()функцията чака изпълнението на greet()функцията.
Забележка : Функцията за обратно извикване е полезна, когато трябва да изчакате резултат, който отнема време. Например данните, идващи от сървър, защото отнема време, докато данните пристигнат.
