de Ashay Mandwarya ?️??

Cum se utilizează metodele apply (?), Call (?) Și bind (➰) în JavaScript

Cum se utilizeaza metodele apply Call Si bind
Fotografie de Pankaj Patel pe Unsplash

În acest articol, vom vorbi despre metodele de aplicare, apelare și legare ale lanțului de prototipuri de funcții. Acestea sunt unele dintre cele mai importante și des utilizate concepte în JavaScript și sunt foarte strâns legate de acest cuvânt cheie.

Deci, pentru a cunoaște informațiile din acest articol, mai întâi trebuie să vă familiarizați cu conceptul și utilizarea acest cuvânt cheie. Dacă sunteți deja familiarizat cu acesta, puteți continua – altfel, puteți consulta acest articol aici și apoi întoarce-te aici.

Sa inveti despre aplică | apelează | leagă trebuie să știm și despre funcțiile din JavaScript, presupunând că sunteți familiarizați acest.

Funcții

1611673508 505 Cum se utilizeaza metodele apply Call Si bind
Fotografie de Ornitorincul roaming pe Unsplash

Constructorul Function creează un nou obiect Function. Apelarea directă a constructorului poate crea funcții dinamic, care pot fi executate în domeniul global.

Deoarece funcțiile sunt obiecte în JavaScript, invocarea lor este controlată de aplicați, apelați și legați metode.

Pentru a verifica dacă o funcție este un obiect Function, putem folosi codul din următorul fragment, care returnează true.

Cum se utilizeaza metodele apply Call Si bind

Obiectul Global Function nu are metode sau proprietăți proprii. Cu toate acestea, deoarece este o funcție în sine, el moștenește unele metode și proprietăți prin lanțul prototip de la Function.prototype. – MDN

Următoarele sunt metodele din lanțul prototipului funcțional:

  • Function.prototype.apply ()
  • Function.prototype.bind ()
  • Function.prototype.call ()
  • Function.prototype.isGenerator ()
  • Function.prototype.toSource ()
  • Object.prototype.toSource
  • Function.prototype.toString ()
  • Object.prototype.toString

Ne preocupă primele trei, așa că să începem.

Aplica ?

1611673509 968 Cum se utilizeaza metodele apply Call Si bind
Fotografie de Julian O’hayon pe Unsplash

aplica() metoda este o metodă importantă a prototipului funcției și este utilizată pentru a apela alte funcții cu un furnizor acest valoarea cuvântului cheie și argumentele furnizate sub formă de matrice sau matrice ca un obiect.

Obiectele asemănătoare matricei se pot referi la NodeList sau la obiectele de argumente din interiorul unei funcții.

Aceasta înseamnă că putem apela orice funcție și specificăm în mod explicit ce acest ar trebui să facă referire în funcția de apelare.

Sintaxă

1611673509 776 Cum se utilizeaza metodele apply Call Si bind

Întoarcere

Returnează rezultatul funcției invocate de acest.

Descriere

aplica metoda este utilizată pentru a permite ca o funcție / obiect aparținând unui obiect x să fie apelată și atribuită unui obiect y.

Exemple

1.

1611673509 504 Cum se utilizeaza metodele apply Call Si bind

După cum se vede în fragmentul dat, vedem că atunci când împingem un tablou în interiorul altui, întregul tablou este tratat ca un element și împins în interiorul variabilei matrice.

Dar dacă vrem ca elementele să fie împinse individual ca un array? Sigur că există literalmente un număr de modalități de a face acest lucru, dar pe măsură ce învățăm să aplicăm, să-l folosim:

1611673510 926 Cum se utilizeaza metodele apply Call Si bind

În exemplul dat putem vedea utilizarea lui aplica în alăturarea a două matrice date. Matricea de argumente este matricea de elemente și acest argumentul indică variabila matrice. Elementele matricei de elemente sunt împinse către obiect (matrice) la care acest este arătând. Obținem rezultatul pe măsură ce elementele individuale ale celei de-a doua matrice sunt împinse către matricea către care acest este arătat.

2.

1611673510 142 Cum se utilizeaza metodele apply Call Si bind

Funcția max în JS este utilizată pentru a găsi elementul cu valoarea maximă dintr-un grup dat de elemente. Dar, după cum putem vedea din fragment, dacă valorile sunt sub formă de matrice, obținem rezultatul ca NaN. Cu siguranță vorbim despre JavaScript, așa că din nou, există n mai multe moduri de a face acest lucru, dar să folosim aplicați.

1611673510 727 Cum se utilizeaza metodele apply Call Si bind

Acum, când folosim apply și folosim funcția Math.max (), obținem rezultatul. După cum știm, aplicarea va lua toate valorile din interiorul matricei ca argumente individuale și apoi le va fi aplicată funcția max. Acest lucru ne va oferi valoarea maximă în matrice.

Un lucru interesant de subliniat aici este că în locul acest am folosit nul. Deoarece argumentul furnizat este matricea numerică, chiar dacă acest este introdus, va indica același tablou și vom obține același rezultat. Prin urmare, în astfel de cazuri, putem folosi nul în locul lui acest. Acest lucru ne arată că acest argumentul în funcția de aplicare este un argument opțional.

Apel

1611673510 400 Cum se utilizeaza metodele apply Call Si bind
Fotografie de Eric Muhr pe Unsplash

apel() metoda este utilizată pentru a apela o funcție cu o dată acest și argumentele oferite individual.

Aceasta înseamnă că putem apela orice funcție, specificând în mod explicit referința care acest ar trebui să facă referire în funcția de apelare.

Acest lucru este foarte asemănător cu aplica, singura diferență fiind aceea aplica ia argumente sub forma unui array sau a unor obiecte de tip array, iar aici argumentele sunt furnizate individual.

Sintaxă

1611673511 110 Cum se utilizeaza metodele apply Call Si bind

Întoarcere

Rezultatul apelării funcției cu specificat this valoare și argumente.

Descriere

apel metoda este utilizată pentru a permite ca o funcție / obiect aparținând unui obiect x să fie apelată și atribuită unui obiect y.

Exemple

1.

1611673511 313 Cum se utilizeaza metodele apply Call Si bind

Acesta este un exemplu de înlănțuire a constructorului. După cum putem vedea, în fiecare funcție se numește constructorul produsului și se folosește apel proprietățile obiectului Produs sunt înlănțuite cu obiectele Pizza și respectiv Toy.

Când sunt create noi instanțe ale obiectelor Pizza și Toy, parametrii sunt furnizați ca nume, preț și categorie. Categoria se aplică numai în definiție, dar numele și prețul sunt aplicate folosind constructorul în lanț al obiectului Produs, așa cum sunt definite și aplicate în obiectul Produs. Cu un pic mai mult de ajustare putem realiza moștenirea.

2.

1611673511 505 Cum se utilizeaza metodele apply Call Si bind

În fragmentul de mai sus, am definit o funcție numită somn. Acesta constă dintr-un răspuns de matrice care constă din elemente care adresează proprietăți folosind acest cuvânt cheie. Acestea sunt definite într-un obiect separat în afara funcției.

Funcția sleep este apelată cu obiectul obiect ca argument. După cum putem vedea, proprietățile obiect sunt stabilite în acest animal și this.sleepDuration, respectiv, și obținem propoziția completă ca rezultat.

Bind➰

1611673512 890 Cum se utilizeaza metodele apply Call Si bind
Fotografie de Michael Held pe Unsplash

lega() metoda creează o nouă funcție care, atunci când este apelată, își are this cuvânt cheie setat la valoarea furnizată, cu o secvență dată de argumente care precedă orice furnizat atunci când este apelată noua funcție. – MDN

Sintaxă

1611673512 321 Cum se utilizeaza metodele apply Call Si bind

Întoarcere

Lega returnează o copie a funcției cu furnizat acest și argumentele.

Descriere

lega funcția seamănă mult cu apel funcție, cu diferența principală fiind că legarea returnează o nouă funcție, în timp ce apelul nu.

Conform specificațiilor ECMAScript 5, funcția returnată de lega este un tip special de obiect cu funcție exotică (așa cum îl numesc ei) numit Funcția legată (BF). BF înfășoară obiectul funcției originale. Apelarea unui BF execută funcția împachetată în acesta.

Exemple

1.

1611673513 664 Cum se utilizeaza metodele apply Call Si bind
Exemplu preluat de la MDN

În fragmentul de mai sus, am definit o variabilă x și un obiect numit modul. De asemenea, conține o proprietate numită X și o altă proprietate a cărei valoare corespunzătoare este o funcție care returnează valoarea lui X.

Când funcția getX se numește returnează valorile lui X care este definit în interiorul obiectului și nu al X în domeniul global.

O altă variabilă este declarată în domeniul global care numește getX funcție din modul obiect. Dar, deoarece variabila se află în sfera globală, acest în getX indică globalul X și, prin urmare, 9 este returnat.

Este definită o altă variabilă care apelează funcția anterioară, dar de această dată leagă funcția menționată cu modul obiect. Această legare returnează valoarea lui X în interiorul obiectului. Datorită legării, acest în funcție indică valoarea lui X în obiect și nu global X. Prin urmare, obținem 81 ca ieșire

Concluzie

Acum că am învățat elementele de bază despre metode, s-ar putea să fiți încă puțin confuz cu privire la motivele pentru care există 3 funcții diferite care fac aproape același lucru. Pentru a clarifica acest concept, trebuie să exersați cu diferite situații și scenarii, astfel încât să puteți afla mai amănunțit unde și cum pot fi utilizate. Cu siguranță vă vor face codul mai curat și mai puternic.

Dacă ți-a plăcut acest articol, te rog să aplaude? și urmează? pentru mai mult.

Cum se utilizeaza metodele apply Call Si bind
Google