I denne vejledning lærer du om JavaScript-tilbagekaldsfunktioner ved hjælp af eksempler.
En funktion er en blok af kode, der udfører en bestemt opgave, når den kaldes. For eksempel,
// function function greet(name) ( console.log('Hi' + ' ' + name); ) greet('Peter'); // Hi Peter
I ovenstående program sendes en strengværdi som et argument til greet()funktionen.
I JavaScript kan du også videregive en funktion som et argument til en funktion. Denne funktion, der sendes som et argument inde i en anden funktion, kaldes en tilbagekaldsfunktion. For eksempel,
// 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, jeg er tilbagekaldsfunktion
I ovenstående program er der to funktioner. Under kaldet til greet()funktionen sendes to argumenter (en strengværdi og en funktion).
Den callMe()funktion er en tilbagekaldsfunktion.
Fordel ved tilbagekaldsfunktion
Fordelen ved at bruge en tilbagekaldsfunktion er, at du kan vente på resultatet af et tidligere funktionsopkald og derefter udføre et andet funktionsopkald.
I dette eksempel skal vi bruge setTimeout()metoden til at efterligne det program, der tager tid at udføre, såsom data, der kommer fra serveren.
Eksempel: 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 verden
Som du ved udfører metoden setTimeout () en blok kode efter det angivne tidspunkt.
Her greet()kaldes funktionen efter 2000 millisekunder ( 2 sekunder). Under denne ventetid sayName('John');udføres den. Derfor er Hello John trykt før Hello world.
Ovenstående kode udføres asynkront (den anden funktion; sayName()venter ikke på den første funktion; greet()til at fuldføre).
Eksempel: Brug af en tilbagekaldsfunktion
I ovenstående eksempel venter den anden funktion ikke på, at den første funktion er afsluttet. Men hvis du vil vente på resultatet af det forrige funktionsopkald, før den næste sætning udføres, kan du bruge en tilbagekaldsfunktion. For eksempel,
// 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 verden Hej John
I ovenstående program udføres koden synkront. Den sayName()funktion føres som et argument til greet()funktionen.
Den setTimeout()metode udfører greet()funktionen først efter 2 sekunder. Men den sayName()funktion venter udførelsen af greet()funktionen.
Bemærk : Tilbagekaldsfunktionen er nyttig, når du skal vente på et resultat, der tager tid. For eksempel dataene kommer fra en server, fordi det tager tid for data at ankomme.
