Dacă sunteți familiarizat cu programarea, știți deja ce funcții fac și cum să le utilizați. Dar ce este o funcție de apel invers? Funcțiile de apel invers sunt o parte importantă a JavaScript-ului și odată ce înțelegeți cum funcționează apelurile inversate, veți deveni mult mai bine în JavaScript.

Așadar, în această postare, aș dori să vă ajut să înțelegeți ce sunt funcțiile de apel invers și cum să le utilizați în JavaScript parcurgând câteva exemple.

Ce este o funcție de apel invers?

În JavaScript, funcțiile sunt obiecte. Putem trece obiectele la funcții ca parametri? Da.

Deci, putem trece și funcții ca parametri către alte funcții și le putem numi în interiorul funcțiilor externe. Sună complicat? Permiteți-mi să arăt asta într-un exemplu de mai jos:

function print(callback) {  
    callback();
}

Funcția print () ia o altă funcție ca parametru și o numește în interior. Acest lucru este valabil în JavaScript și îl numim „callback”. Deci, o funcție care este transmisă unei alte funcții ca parametru este o funcție de apel invers. Dar asta nu este tot.

ad-banner

De asemenea, puteți viziona versiunea video a funcțiilor de apel invers mai jos:

De ce avem nevoie de funcții de apel invers?

JavaScript rulează cod secvențial în ordine de sus în jos. Cu toate acestea, există unele cazuri în care codul rulează (sau trebuie să ruleze) după ce se întâmplă altceva și, de asemenea, nu secvențial. Aceasta se numește programare asincronă.

Rambursările se asigură că o funcție nu va rula înainte ca o sarcină să fie finalizată, dar va rula imediat după finalizarea sarcinii. Ne ajută să dezvoltăm cod JavaScript asincron și ne protejează de probleme și erori.

În JavaScript, modalitatea de a crea o funcție de apel invers este să o transmiteți ca parametru la o altă funcție și apoi să o apelați imediat după ce sa întâmplat ceva sau când s-a finalizat o sarcină. Să vedem cum …

Cum se creează un apel invers

Pentru a înțelege ceea ce am explicat mai sus, permiteți-mi să încep cu un exemplu simplu. Vrem să înregistrăm un mesaj pe consolă, dar ar trebui să fie acolo după 3 secunde.

const message = function() {  
    console.log("This message is shown after 3 seconds");
}
 
setTimeout(message, 3000);

Există o metodă încorporată în JavaScript numită „setTimeout”, care apelează o funcție sau evaluează o expresie după o anumită perioadă de timp (în milisecunde). Deci, aici, funcția „mesaj” este apelată după ce au trecut 3 secunde. (1 secundă = 1000 milisecunde)

Cu alte cuvinte, funcția de mesaj este apelată după ce sa întâmplat ceva (după 3 secunde au trecut pentru acest exemplu), dar nu înainte. Deci funcția de mesaj este un exemplu de funcție de apel invers.

Ce este o funcție anonimă?

Alternativ, putem defini o funcție direct în interiorul altei funcții, în loc să o numim. Va arăta astfel:

setTimeout(function() {  
    console.log("This message is shown after 3 seconds");
}, 3000);

După cum putem vedea, funcția de apel invers nu are nume și o definiție a funcției fără un nume în JavaScript este numită „funcție anonimă”. Aceasta face exact aceeași sarcină ca și exemplul de mai sus.

Callback ca funcție de săgeată

Dacă preferați, puteți scrie, de asemenea, aceeași funcție de apel invers ca o funcție săgeată ES6, care este un tip de funcție mai nou în JavaScript:

setTimeout(() => { 
    console.log("This message is shown after 3 seconds");
}, 3000);

Dar evenimentele?

JavaScript este un limbaj de programare bazat pe evenimente. De asemenea, folosim funcții de apel invers pentru declarațiile de evenimente. De exemplu, să presupunem că vrem ca utilizatorii să facă clic pe un buton:

<button id="callback-btn">Click here</button>

De data aceasta vom vedea un mesaj pe consolă numai atunci când utilizatorul face clic pe buton:

document.queryselector("#callback-btn")
    .addEventListener("click", function() {    
      console.log("User has clicked on the button!");
});

Deci, aici selectăm butonul mai întâi cu id-ul său și apoi adăugăm un ascultător de evenimente cu metoda addEventListener. Este nevoie de 2 parametri. Primul este tipul său, „faceți clic”, iar al doilea parametru este o funcție de apel invers, care înregistrează mesajul când se face clic pe buton.

După cum puteți vedea, funcțiile de apel invers sunt utilizate și pentru declarațiile de evenimente în JavaScript.

Învelire

Callback-urile sunt folosite adesea în JavaScript și sper că această postare vă va ajuta să înțelegeți ce fac de fapt și cum să lucrați mai ușor cu ele. Apoi, puteți afla despre JavaScript Promises, care este un subiect similar pe care l-am explicat în noua mea postare.

Dacă doriți să aflați mai multe despre dezvoltarea web, nu ezitați urmărește-mă pe Youtube!

Mulțumesc că ai citit!