JavaScript Function Closures | Forklart
Begrepet nedleggelser har eksistert i ganske lang tid nå, men folk har problemer med å forstå det. Vi kommer til å gå over trinn for trinn og gjøre det veldig enkelt å forstå ved hjelp av eksempler.
Hva er nedleggelser i JavaScript
Veldig kort, nedleggelse har tilgang til det ytre omfanget fra det indre omfanget når du jobber med nestede funksjoner. En nedleggelse opprettes hver gang en nestet funksjon utføres i JavaScript. Variablene som er definert i funksjonen opprettes ved funksjonsutførelse og fjernes fra minnet etter fullstendig utførelse av den respektive funksjonen.
For å forstå konseptet med nedleggelser i JavaScript, må vi vite forskjellen mellom det globale omfanget og det lokale omfanget. Vel, vi kommer til å gå over disse virkelig kort.
Omfang av variabel
Som nevnt ovenfor, er det to store variable omfang i JavaScript:
- Globalt omfang
- Lokalt omfang
Variablene definert utenfor en hvilken som helst funksjon er kjent som Globale variabler og ha en Globalt omfang. Disse variablene kan nås hvor som helst inne i programmet, og det er grunnen til at vi bruker begrepet “global”.
Til sammenligning er variablene definert i en funksjon kjent som Lokale variabler og er kjent for å ha en Lokalt omfang. Lokalt omfang er videre delt inn i funksjonsomfang og blokkeringsomfang, men det er ikke et stort problem for oss. Lokale variabler kan bare nås fra funksjonen de blir erklært
Ta denne kodeblokken for å forstå omfanget:
var SitName = "Linuxhint!";funksjon Printsitename ()
La TopicName = "JavaScript";
konsoll.logg (Situame);
Printsitename ();
konsoll.Log (TopicName);
Det vi gjør i koden ovenfor er at vi oppretter en global variabel side navn og vi skriver den ut i en funksjon som heter Printsitename (), Denne funksjonen inkluderer en lokal variabel EmneName Og vi prøver å skrive ut verdien av denne variabelen utenfor denne funksjonen. Her, side navn er en global variabel og EmneName er en lokal variabel. Utgangen til følgende kode er som:
Som du tydelig kan se, kunne vi få tilgang til side navn variabler i en funksjon, men vi hadde ikke tilgang til den lokale variabelen EmneName Utenfor funksjonen. Du kan lære flere detaljer om disse forskjellige variablene og omfanget.
Hvordan fungerer en nedleggelse i JavaScript
Nå som vi vet hvordan scoping fungerer i JavaScript, kan vi lett forstå arbeidet med nedleggelser.
Stenginger er funksjoner som er nestet inne i hverandre på en slik måte at den indre funksjonen blir lokalt scoped for den ytre funksjonen, og den ytre funksjonen blir globalt scoped for den indre funksjonen. Noe som betyr at den indre funksjonen har tilgang til attributtene til den ytre funksjonen.
For bedre forståelse, ta følgende kode:
funksjon ytrefunksjon ()La Outvar = "Jeg er ytre";
funksjon innerfunksjon ()
La Invar = "Jeg er indre";
konsoll.logg (outvar);
konsoll.logg (invar);
Return InnerFunction ();
ytrefunksjon ();
Vi lager en ytrefunksjon og en Innerfunksjon inne i ytrefunksjon. Fra innsidefunksjonen får vi tilgang til variabelen Outvar som er den lokale variabelen til ytrefunksjon, og skrive ut verdien sammen med verdien av variabelen i den indre funksjonen.
Slik fungerer denne koden:
Utgangen til koden ovenfor er:
Vi var i stand til å få verdiene til begge variablene og skrive dem ut til konsollen ved å bruke konsoll.Logg() funksjon.
Hvordan ha flere funksjoner i en annen funksjon i en lukking
Hvis vi refererer til den ytre funksjonen som Foreldrefunksjon av nedleggelsen og den indre funksjonen som Barnefunksjon av nedleggelsen. Da kan vi si det på denne måten at en enslig forsørger kan få flere barn. En overordnet funksjon vil ikke ha tilgang til attributtene til barna. Imidlertid vil hvert barn ha tilgang til attributtene til foreldrene. Siden en barnefunksjon også er et attributt for foreldrene, slik at en barnefunksjon også kan få tilgang til de andre barnefunksjonene til samme forelder; Dette betyr å ha tilgang til søsknene.
Merk: Parametere og argumenter er også tilgjengelige for barn.
Anta at vi ønsker å lage en funksjon som hilser en funksjon som kaller den. Denne funksjonen har 3 parametere, første navn, middlename og etternavn.
Først må du lage funksjonen ved hjelp av følgende linjer.
funksjon hilsen (FirstName, Middlename, LastName)// senere kommandoer her inne
Denne hilsenfunksjonen er en overordnet funksjon med fire barn. 3 av barna jobber med parametrene og returnerer verdien av parametrene som:
funksjon getFirst ()Return FirstName;
funksjon getMiddle ()
return Middlename;
funksjon getLast ()
Returner etternavn;
Det siste barnet, kaller alle søsknene sine og skriver ut verdiene på konsollen, som implementeres med følgende linjer:
funksjon namePrinter ()konsoll.Logg ("Velkommen! " + getFirst () +" " + getMiddle () +" " + getLast ());
På slutten av overordnet funksjon Hilsen () det returnerer namePrinter () barn til stedet der det kalles.
Å utføre hele dette Lukking Vi må ringe overordnede funksjonen med følgende linje:
hilsen ("John", "Bukhari", "doe");Den komplette kodebiten for denne nedleggelsen er:
funksjon hilsen (FirstName, Middlename, LastName)funksjon getFirst ()
Return FirstName;
funksjon getMiddle ()
return Middlename;
funksjon getLast ()
Returner etternavn;
funksjon namePrinter ()
konsoll.Logg ("Velkommen! " + getFirst () +" " + getMiddle () +" " + getLast ());
return namePrinter ();
hilsen ("John", "Bukhari", "doe");
Vi får følgende utdata:
Konklusjon
Stengingen er en funksjon som fulgte med ES6 -utgivelsen av JavaScript. Stenginger er implementeringen av konseptet basert på omfang av variabler i JavaScript. Vi lærte hva nedleggelser er, og siden de er basert på scoping av variabler lærte vi også om scoping. Vi gikk gjennom forskjellen mellom globalt omfang og variabelt omfang i JS, og til slutt testet vi ut arbeidet med nedleggelser ved hjelp av eksempler.