Hvordan bruke metodene Apply (?), Call (?) Og Binding (➰) i JavaScript

I denne artikkelen vil vi snakke om anvendelses-, samtale- og bindemetodene til funksjonsprototypekjeden. De er noen av de viktigste og mest brukte konseptene i JavaScript, og er veldig nært knyttet til dette søkeordet.

Så for å få tak i informasjonen i denne artikkelen, må du først være kjent med konseptet og bruken av dette nøkkelordet. Hvis du allerede er kjent med det, kan du fortsette - ellers kan du henvise til denne artikkelen her og deretter komme tilbake hit.

For å lære om bruk | ring | bind må vi også vite om funksjoner i JavaScript, forutsatt at du er kjent med dette .

Funksjoner

Funksjonskonstruktøren oppretter et nytt funksjonsobjekt. Å ringe konstruktøren direkte kan opprette funksjoner dynamisk, som kan utføres i det globale omfanget.

Siden funksjoner er objekter i JavaScript, styres påkallingen av metodene for bruk, samtale og bind .

For å sjekke om en funksjon er et funksjonsobjekt, kan vi bruke koden i følgende kodebit, som returnerer true.

Det globale funksjonsobjektet har ingen egne metoder eller egenskaper. Men siden det er en funksjon i seg selv, arver den noen metoder og egenskaper gjennom prototypekjeden fra Function.prototype. - MDN

Følgende er metodene i funksjonsprototypekjeden:

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

Vi er opptatt av de tre første, så la oss begynne.

Søke om ?

Den gjelder () metoden er en viktig metode for funksjons prototype og brukes til å anrope andre funksjoner med en gitt denne ordet verdi og argumenter tilveiebringes i form av matrise eller et matrise som objekt.

Arraylignende objekter kan referere til NodeList eller argumentobjektet i en funksjon.

Dette betyr at vi kan kalle en hvilken som helst funksjon og eksplisitt spesifisere hva dette skal referere til i anropsfunksjonen .

Syntaks

Komme tilbake

Den returnerer resultatet av funksjonen som påkalles av denne.

Beskrivelse

Den anvende metoden benyttes for å tillate en funksjon / gjenstand som tilhører et objekt x for å bli kalt og overdratt til et objekt y.

Eksempler

1.

Som vi ser i det gitte utdraget, ser vi at når vi skyver en matrise inne i en annen, blir hele matrisen behandlet som ett element og dyttet inn i matrixvariabelen.

Men hva om vi vil at elementene skal skyves individuelt i stedet for en matrise? Klart det er bokstavelig talt mange måter å gjøre det på, men når vi lærer å bruke, la oss bruke det:

I det gitte eksemplet kan vi se bruken av gjelder for å bli med i to gitte matriser. Argumentarrayen er elementmatrisen, og dette argumentet peker på arrayvariabelen. Elementene i elementmatrisen skyves til objektet ( matrisen ) som dette er tilpeker . Vi får resultatet når den andre matrikkens individuelle elementer presses til matrisen som dette er pekt på.

2.

Maksfunksjonen i JS brukes til å finne elementet med maksimumsverdien fra en gitt pool av elementer. Men som vi kan se fra utdraget, hvis verdiene er i form av en matrise, får vi resultatet som NaN. Sikkert vi snakker om JavaScript så igjen, det er flere måter å gjøre dette på, men la oss bruke gjelder.

Nå når vi bruker bruke og bruke Math.max () -funksjonen, får vi resultatet. Som vi vet vil applikasjonen ta alle verdiene i matrisen som individuelle argumenter, og deretter blir maksfunksjonen brukt på dem. Dette vil gi oss den maksimale verdien i matrisen.

En interessant ting å påpeke her er at i stedet for dette har vi brukt null. Ettersom argumentet som er gitt er tallmatrisen, selv om dette blir introdusert, vil det peke på samme matrise og vi vil få det samme resultatet. Derfor kan vi i slike tilfeller bruke null i stedet for dette. Dette viser oss at dette argumentet i funksjonen gjelder er et valgfritt argument.

Anrop

Den ringe () metoden benyttes for å kalle en funksjon med en gitt denne og argumenter som er oppgitt til det individuelt.

Dette betyr at vi kan kalle en hvilken som helst funksjon, og eksplisitt spesifisere referansen som denne skal referere til i anropsfunksjonen .

Dette er veldig likt å bruke, den eneste forskjellen er at gjelder tar argumenter i form av en matrise eller array-lignende objekter, og her blir argumentene gitt individuelt.

Syntaks

Komme tilbake

Resultatet av å ringe funksjonen med den angitte thisverdien og argumentene.

Beskrivelse

Den samtalen metoden benyttes for å tillate en funksjon / gjenstand som tilhører et objekt x for å bli kalt og overdratt til et objekt y.

Eksempler

1.

Dette er et eksempel på konstruktorkjetting. Som vi kan se, kalles konstruktøren av produktet i hver funksjon, og ved bruk av ring lenkes egenskapene til produktobjektet med henholdsvis Pizza- og leketøyobjektene.

Når nye forekomster opprettes av Pizza- og leketøyobjektene, oppgis parametere som navn, pris og kategori. Kategori brukes bare i definisjonen, men navnet og prisen brukes ved hjelp av den kjedede konstruktøren til produktobjektet, slik de er definert og brukt i produktobjektet. Med litt mer justering kan vi oppnå arv.

2.

I utdraget ovenfor definerte vi en funksjon som heter søvn. Den består av et array-svar som består av elementer som adresserer egenskaper ved hjelp av dette nøkkelordet. De er definert i et eget objekt utenfor funksjonen.

Funksjonen sleep kalles med objektet obj som argument. Som vi kan se, er egenskapene til obj satt i henholdsvis this.animal og this.sleepDuration , og vi får hele setningen som utdata.

Bind➰

Den bind () metoden skaper en ny funksjon som, når den kalles, har sitt thisordet satt til den angitte verdi, med en gitt sekvens av argumenter foregående hvilken som helst forutsatt når den nye funksjonen kalles. - MDN

Syntaks

Komme tilbake

Bind returnerer en kopi av funksjonen med den medfølgende dette og argumentene.

Beskrivelse

Den bind funksjon er mye som samtalefunksjonen, med den største forskjellen er som binder returnerer en ny funksjon, mens samtalen ikke.

I henhold til ECMAScript 5-spesifikasjoner er funksjonen som returneres av bind en spesiell type eksotisk funksjonsobjekt (som de kaller det) kalt Bound-funksjonen (BF) . BF pakker inn det opprinnelige funksjonsobjektet. Å ringe en BF kjører den innpakket funksjonen i den.

Eksempler

1.

I utdraget ovenfor har vi definert en variabel x og et objekt som kalles modul. Den inneholder også en egenskap kalt x og en annen egenskap hvis tilsvarende verdi er en funksjon som returnerer verdien av x .

Når funksjonen getX heter, returnerer den verdiene til x som er definert inne i objektet og ikke x i det globale omfanget.

En annen variabel er angitt i den globale omfang som kaller opp GETX funksjon fra modulen objektet. Men ettersom variabelen er i det globale omfanget, peker dette i getX til det globale x og dermed blir 9 returnert.

En annen variabel er definert som kaller forrige funksjon, men denne gangen binder nevnte funksjon med modulobjektet . Denne bindingen returnerer verdien av x inne i objektet. På grunn av bindingen peker dette i funksjonen til verdien av x i objektet og ikke den globale x . Derfor får vi 81 som utgang

Konklusjon

Nå som vi har lært det grunnleggende om metodene, kan du fremdeles være litt forvirret over hvorfor det er 3 forskjellige funksjoner som gjør nesten det samme. For å avklare dette konseptet, må du øve på forskjellige situasjoner og scenarier, slik at du kan lære mer grundig hvor og hvordan de kan brukes. De vil helt sikkert gjøre koden renere og kraftigere.

Hvis du likte denne artikkelen, vennligst klapp? og følge med? for mer.