Hva er tilbakeringingsfunksjoner i JavaScript?

Hvis du er en programmerer, har du sikkert hørt om funksjoner, som er et sett med utsagn som utfører en handling og returnerer en utgang, men hva er tilbakeringingsfunksjoner?

Tilbakeringingsfunksjonen er et ekstremt viktig konsept av JavaScript og er mye brukt i løfter, hendelseslyttere, matriser og mye mer.

Vi vil gå over hva tilbakeringingsfunksjoner er og hvordan du bruker dem i JavaScript i denne opplæringen, så vel som vi også vil snakke om de synkrone og asynkrone tilbakeringingsfunksjonene. For å ha klare og dyptgripende konsepter av tilbakeringingsfunksjoner vil vi også implementere noen eksempler.

Tilbakeringingsfunksjon

En tilbakeringingsfunksjon er en funksjon som først blir gitt som et argument for en annen funksjon og må utføres etter uttalelsene som er skrevet i den funksjonsdefinisjonen, og som navnet tilsier, kjøres den senere innenfor funksjonen. For å si det med enkle ord, utføres en tilbakeringingsfunksjon når gjeldende effekt blir behandlet.

Syntaks for å skrive en tilbakeringingsfunksjon i JavaScript

Den grunnleggende syntaksen er:

funksjon nameFunc (callbackFunc)
callbackFunc ();

Dette er en 'namefunc ()' funksjon det tar en 'callbackfunc ()' funksjon som et argument. De 'callbackfunc ()' funksjon kalles innenfra 'namefunc ()' funksjon Så det er faktisk en tilbakeringingsfunksjon.

Eksempel1

Anta at vi vil trøste.Logg en melding etter 2 sekunder.

funksjonsmelding ()
konsoll.Logg ("Hello World etter 2 sekunder");

setTimeout (melding, 2000);

De setTimeout () -funksjon er en innebygd metode for JavaScript som tar en tidtaker og en tilbakeringingsfunksjon som et argument. Nå vil meldingsfunksjonen (en tilbakeringingsfunksjon) bare bli kalt og bli utført når tidtakeren vil utløpe.

I koden ovenfor blir funksjonsmeldingen () bestått som et argument, og den kalles etter 2000 millisekunder (2 sekunder). Nå for å relatere dette til tilbakekallingsfunksjonen, ble meldingen () -funksjonen kalt etter 2 sekunder. Det ble ikke henrettet før de to sekundene. Derfor er det en tilbakeringingsfunksjon.

Behov for tilbakeringingsfunksjoner?

Du må tenke hvorfor trenger vi til og med tilbakeringingsfunksjoner. Svaret er enkelt. JavaScript er et sekvensielt eller entrådd språk som betyr at det utfører sekvensielt linje for linje.

JavaScript venter ikke på svar før du går videre til neste linje. Det vil fortsette å henrette og lytte etter andre hendelser eller kodelinjer.

For eksempel:

Eksempel2

Anta at vi logger 1 og 2 fra to forskjellige funksjoner til konsollen:

funksjon FirstMessage ()
konsoll.logg ("1");

funksjon SecondMessage ()
konsoll.logg ("2");

FirstMessage ();
SecondMessage ();

Produksjon:

1
2

Som forventet, funksjonen FirstMessage () utføres først og deretter SecondMessage () -funksjon utføres.

Eksempel3

Anta at FirstMessage () -metode omfatter en API -forespørsel om å hente data fra en server. Vi må vente på serverens svar/svar, og la oss derfor bruke den innebygde metoden Settimeout en gang til.

Denne gangen forsinker vi forespørselen med 3 sekunder for å se hvordan vi kan be om en API -henteforespørsel.

funksjon FirstMessage ()
// timeout -funksjon for å forsinke forespørsel
setTimeout (funksjon ()
konsoll.logg ("1");
, 3000);

funksjon SecondMessage ()
konsoll.logg ("2");

FirstMessage ();
SecondMessage ();

I denne koden flyttet vi nettopp konsollen.logg (“1”); inne i setTimeout () -funksjon.

Det som virkelig er interessant, er at når du kjører denne koden, vil du se at de 2 blir vist først i konsollen:

Etter 3 sekunder vil 1 vises:

Som vi kan se, FirstMessage () -funksjon ble kalt først og deretter SecondMessage () -funksjon ble kalt. Vi kan imidlertid ikke se resultatet i sekvensen vi kalte vår funksjon.

Det er ikke slik at JavaScript ikke returnerte koden vår sekvensielt, det er bare at JavaScript ikke ventet på FirstMessage () -funksjon å utføre helt og begynte å utføre SecondMessage () -funksjon.

Dette eksemplet ble utelukkende satt her for å vise deg hvorfor vi trenger tilbakeringingsfunksjoner. Tilbakeringingsfunksjoner La oss sørge for at noen koder ikke vil utføre før vår nødvendige kode er utført.

Tilbakeringingsfunksjonstyper

Nå som vi har sett hva tilbakeringinger er, hvordan de brukes, og hvorfor de er viktige, la oss se på de to typene tilbakeringingsfunksjoner.

Synkron tilbakeringingsfunksjon

Synkrone tilbakeringingsfunksjoner kjøres/utføres samtidig som den høyere ordenfunksjonen som bruker tilbakeringingsfunksjonen og hovedsakelig blokkerer; Den fullfører oppgaven sin og gir kontrollen til en annen funksjon eller kodelinje.

Dette er gunstig som antar at du henter gjenstander fra en API. Du vil at siden din skal laste inn når du henter noen data fra en API. Med mindre responsen fra API er hentet, må hele nettstedet vente.

Eksempel 2 angitt ovenfor var synkrone funksjoner som den utførte linje for linje, og når den første funksjonen ble utført først, ble kontrollen gitt til den andre funksjonen I-E SecondMessage () funksjon.

Asynkron tilbakeringingsfunksjon

Asynkron er helt motsatt av synkron når det fungerer parallelt med den som ringer av funksjonen og tilbakekallingsfunksjonen. Asynkrone funksjoner er ikke-blokkerende når de kjører eller utfører senere enn høyere ordenfunksjon.

Eksempel 3 gitt ovenfor var en asynkron tilbakeringingsfunksjon som vi kalte FirstMessage () -funksjon Men det ventet i to sekunder. I løpet av de to sekundene ga det kontrollen tilbake og SecondMessage () -funksjon ble henrettet. Når de tre sekundene var oppe, var det FirstMessage () -funksjon begynte å henrette igjen.

Konklusjon

EN tilbakeringingsfunksjon er en funksjon som først blir levert som et argument for en annen funksjon og må utføres etter uttalelsene som er skrevet i den funksjonsdefinisjonen. Vi lærte hva tilbakeringingsfunksjoner er og hvordan du bruker dem i JavaScript, samt hvorfor tilbakeringingsfunksjoner er viktige og hva de to typene tilbakeringingsfunksjoner er i dette innlegget.