Dette, bind, ring og søk i JavaScript | Forklart

Dette, bind, ring og søk i JavaScript | Forklart
Bind, ring og anvendelse er virkelig nyttige og spesielle metoder som hjelper oss å oppnå lån av funksjoner og metoder fra ett objekt til et annet ved å bruke referansen "dette”. Dette er et lite avansert emne, det er grunnen til at vi kommer til å ta ting sakte for deg og forklare hver minutt detalj med eksempler.

JavaScript og mange andre programmeringsspråk bruker nøkkelordet dette For å gi referansen til foreldreobjektet/klassen til dets funksjoner og metoder i dem. Mens bind, ring og bruker metoder fungerer ved henvisning til referanse for å låne attributter fra ett objekt til et annet. Bind, ring og anvendelsesfunksjon ble lagt til i JavaScript i ECMA2015 -utgivelsen.

"Denne" referansen

Nøkkelordet dette har en veldig spesifikk betydning i JavaScript, det refererer til objektet som kaller funksjonen. Hvis vi jobber med en konstruktørmetode, så nøkkelordet dette ville referere til klassen og dens egenskaper, hvis vi jobber med noen DOM -elementer da dette Nøkkelord vil referere til de globale verdiene til DOM.

For å demonstrere dette, lag følgende objekt ved å bruke følgende linjer:

var person =
Navn: "John Doe",
Alder: 25,
Betegnelse: "Revisor",
printName: funksjon ()
konsoll.Logg (dette.Navn);
,
;

Som du ser, i objektpersonen har vi en funksjon PrintName som vil skrive ut navnet på personen, og inne i konsoll.Logg() Vi kan se at vi har linjen:

dette.Navn;

Dette Nøkkelordet oppretter en referanse til objektet og ber kompilatoren hente "navnet" fra akkurat dette objektet.

Ring og bruk metoder

Anrop og søke om kan begge defineres samtidig fordi de har nesten nøyaktig den samme arbeidsmekanikken. Ring og bruk brukes til funksjonslån, funksjonslånsmidler for å bruke funksjonen til et annet objekt og bruke referansen til et annet objekt.

For å forstå dette konseptet bedre, lag to forskjellige objekter ved å bruke følgende kodelinjer:

var person1 =
Navn: "John Doe",
Alder: 25,
Betegnelse: "Revisor",
printName: funksjon ()
konsoll.Logg (dette.Navn);
,
;
var person2 =
Navn: "Baba Yaga",
Alder: 22,
Betegnelse: "Arbeidsledig",
;

Som du kan se i kodebiten, har vi nesten den samme strukturen av både objektene og de samme nøkkelverdiparene bortsett fra det faktum at Person1 har funksjonen PrintName samtidig som Person2 gjør ikke. Men hvis du vil skrive ut "navnet" på Person2 objekt, du kan gjøre det ved å bruke metoden “printname” fra Person1 objekt, og for “dette”Referanse, du passerer i referansen til objektet Person2.

Syntaks for samtale og søk:

Syntaksen til begge disse metodene er nesten identisk:

For samtalemetode er syntaksen som:

obj1.funksjon.Call (RefferenceOfObject2, Arg1 Arg2, Arg3 ...);

For anvendelsesmetode er syntaksen som:

obj1.funksjon.Apply (RefferenceOfObject2, [Arg1, Arg2, Arg3,…]);

Merk: Hvis funksjonen du låner trenger noen ekstra argumenter, så i samtalemetode Du passerer i argumentene atskilt med et komma "", og i tilfelle av anvendelsesmetoden, passerer du flere argumenter som en Array List.

Bruke anrop og anvende metoder

Når vi kommer tilbake til vårt opprinnelige problem, kan vi bruke "PrintName”Funksjon fra“Person1”Objekt for å skrive ut navnet på Person2 Objekt ved å bruke følgende kodelinje:

Person1.PrintName.ring (person2);

Hvis du kjører kommandoen ovenfor, vil du se følgende utdata:

Tilsvarende kan du bruke søke om() Metode for samme formål ved å bruke kode:

Person1.PrintName.Bruk (Person2);

Men hva om PrintName () Funksjon tar noen argumenter som:

printName: funksjon (by, søsken)
konsoll.logg ('$ dette.name fra $ city har $ søsken søsken ');
,

For dette tilfellet vil du bruke samtalefunksjonen med følgende kodelinje:

Person1.PrintName.Ring (Person2, "New York", 4);

Det komplette kodebiten er som:

var person1 =
Navn: "John Doe",
Alder: 25,
Betegnelse: "Revisor",
printName: funksjon (by, søsken)
konsoll.logg ('$ dette.name fra $ city har $ søsken søsken ');
,
;
var person2 =
Navn: "Baba Yaga",
Alder: 22,
Betegnelse: "Arbeidsledig",
;
Person1.PrintName.Ring (Person2, "New York", 4);

Hvis du utfører følgende kode, vil du få utdataene som:

Som du ser, kunne du bestå argumentene ved hjelp av samtalemetoden, du kan gjøre dette ved å bruke søke om() Metode også ved å bruke følgende kodebit:

var person1 =
Navn: "John Doe",
Alder: 25,
Betegnelse: "Revisor",
printName: funksjon (by, søsken)
konsoll.logg ('$ dette.name fra $ city har $ søsken søsken ');
,
;
var person2 =
Navn: "Baba Yaga",
Alder: 22,
Betegnelse: "Arbeidsledig",
;
Person1.PrintName.Bruk (Person2, ["New York", 4]);

Merk: for å sende argumenter til den lånte funksjonen gjennom søke om() Metode, vi bruker en matrise som inneholder argumentene.

Hvis du utfører denne koden, vil du få den samme identiske utdataene som:

Men hva hvis du ikke vil låne en funksjon fra et objekt? Det er her bind metode kommer i spill.

Bind () -metoden

i motsetning til anrop og søke om metoder, binde Metoder brukes til å lage en kopi av en funksjon og deretter plassere den kopierte funksjonen som en attributt for objektet slik at funksjonen kan brukes på et senere tidspunkt.

Syntaks av bindingsmetoden

Syntaksen er som:

var newFunctionName = objekt1.funksjon.bind (referansecetoobject2);

Merk: Bind -metoden returnerer en funksjon som er replikert.

For å demonstrere dette, la oss endre koden fra eksemplet ovenfor på denne måten:

var person1 =
FirstName: "John",
LastName: "Doe",
Alder: 25,
printfullname: funksjon ()
konsoll.Logg (dette.FirstName + "" + dette.etternavn);
,
;
var person2 =
FirstName: "Baba",
LastName: "Yaga",
Alder: 25,
;

Nå hvis du vil lage en kopi av funksjonen PrintFullName fra objektet Person1 og gjør det til et attributt av objektet Person2 Da kan du gjøre det ved å bruke følgende kodelinje:

var printmyname = person1.PrintFullName.bind (person2);

Med denne linjen har du “bindet”En attributtfunksjon printmyname med objektet Person2, Og du kan påkalle den ved hjelp av kommandoen:

printmyname ()

Merk: Du kaller det ikke med Person2 objekt ved å bruke dot-operate fordi referansen til Person2 objektet er allerede “bindet”Til funksjonen.

Det komplette kodebiten er som:

var person1 =
FirstName: "John",
LastName: "Doe",
Alder: 25,
printfullname: funksjon ()
konsoll.Logg (dette.FirstName + "" + dette.etternavn);
,
;
var person2 =
FirstName: "Baba",
LastName: "Yaga",
Alder: 25,
;
var printmyname = person1.PrintFullName.bind (person2);
printmyname ();

Når du utfører dette kodebiten, får du følgende utdata:

Der du går, har du duplisert en funksjon fra Person1 objekt, passert referansen til Person2 objekt, og lagret det som en egen funksjon.

Konklusjon

Ring, bind og søke om Metoder er kompliserte metoder som brukes til å leke med referansen til objektene og hjelpe deg med å oppnå bragder som funksjonslån og funksjonsreplikasjon med en annen referanse. For å forstå detaljene i disse funksjonene må vi vite hva nøkkelordet dette betyr i JavaScript og hvordan referanser fungerer i JS. Du lærte om å jobbe med dette, ringe, bruke og binde metoder sammen med eksemplene deres.