Nybegynnerguide til JavaScript -stenginger

“Stenginger”Er blant JavaScripts mest grunnleggende byggesteiner. Som en JavaScript -nybegynner kan du ha brukt nedleggelser med vitende eller uvitende; Å samle kunnskap om å arbeide med nedleggelser er imidlertid avgjørende, da det gjør at du kan forstå samspillet mellom variabler og funksjoner og utførelsesprosessen til JavaScript -programmet ditt.

Denne oppskrivningen er en komplett Nybegynnerguide til JavaScript -stenginger der vi vil diskutere variabel tilgang innen forskjellige omfang.

Før vi dykker inn i konseptet med JavaScript -stenginger, vil vi først forklare hva Leksikalsk scoping er som begge begrepene er assosiert med hverandre.

Leksikalsk scoping i JavaScript

Det variable omfanget bestemmes av erklæringen i kildekoden, kjent som “Leksikalsk scoping”. For eksempel, i det undergitte eksemplet, er det opprettet "Navn”Variabel er en“global"Variabel som betyr at det kan nås hvor som helst i programmet, for eksempel innenfor"DisplayMessage ()”Funksjon.

Derimot, "info" er en "lokal”Variabel som bare kan nås i"DisplayMessage ()”Funksjon:

La navn = 'Alex';
funksjon displayMessage ()
La info = 'Hei! Mitt navn er';
konsoll.logg (info + " + navn);

DisplayMessage ();

Utførelse av den ovennevnte koden vil vise følgende utgang:

Nestet leksikalsk scoping i JavaScript

Omfanget av variablene kan hekkes ved hjelp av “Leksikalsk scoping”På en slik måte at den indre funksjonen kan ha tilgang til variablene erklært i det ytre omfang.

Tenk på følgende eksempel:

funksjon displayMessage ()
La info = 'Hei! Mitt navn er Alex.';
funksjonshow ()
konsoll.logg (info);

forestilling();

DisplayMessage ();

I dette eksemplet "DisplayMessage ()”Funksjon har en lokal variabel som heter“info”Og en nestet”forestilling()”Funksjon, hvor“forestilling()" er en indre funksjon som har muligheten til å få tilgang til verdien av “info”Variabel fra ytre omfang.

Så når “DisplayMessage ()”Funksjon utføres, den vil kalle“forestilling()”Funksjon, som deretter vil få tilgang til“info”Variabel og vise verdien på konsollen:

Nå vil vi endre "DisplayMessage ()”Metode og i stedet for å påkalle det indre”forestilling()”Funksjon, vil vi legge til en uttalelse for å returnere“forestilling()”Funksjonsobjekt:

funksjon displayMessage ()
La info = 'Hei! Mitt navn er Alex.';
funksjonshow ()
konsoll.logg (info);

returshow;

Vi har også tildelt verdien som er returnert av "DisplayMessage ()”Funksjon til“x”Variabel:

La x = displayMessage ();

Til slutt vil vi påkalle “x ()”Funksjon som refererer til“forestilling()”Funksjon:

konsoll.log (x ());

Du kan se fra den gitte utgangen, verdien av den lokale variabelen “info”Eksisterer fremdeles som vanligvis gjenstår i minnet til utførelsen av funksjonen der den er erklært:

Virker forvirret? Dette er magien med Lukking som du har sett i det siste eksemplet som “forestilling()”Er en lukkefunksjon som opprettholder det ytre omfanget i sitt eget omfang.

Hva er JavaScript -stenginger

JavaScript -funksjoner fungerer også som "Stenginger”Fordi kroppen til en funksjon har tilgang til variablene som er definert utenfor den. Eller vi kan definere “Lukking”Som en funksjon som er en barnefunksjon og kan få tilgang til variablene som er opprettet i“foreldre”Funksjonsomfang.

La oss nå sjekke ut noen eksempler for å forstå sammenhengen mellom variable omfang og nedleggelse i JavaScript.

Eksempel 1
Dette eksemplet demonstrerer hvordan en “lokal”Variabel”info”Kan nås i"forestilling()”Funksjon der den opprettes. Husk at det gjenværende skriptet ikke har tilgang til dette “info”Variabel:

funksjonshow ()
La info = 'Hei! Mitt navn er Alex.';
Returinfo;

forestilling();

Når “forestilling()”Funksjon utføres, den vil vise verdien som er lagret i“info”Variabel:

Eksempel 2
Nå vil vi erklære “info" som en "global”Variabel som er referert til i“forestilling()”Funksjon (har forskjellige omfang):

La info = 'Hei! Mitt navn er Alex.';
funksjonshow ()
Returinfo;

forestilling();

Som JavaScript -funksjonen "forestilling()”Funksjon er en“Lukking”, Vil det opprettholde omfanget og tilstanden til“info”Variabel:

Eksempel 3
I en annen situasjon, når variabler er definert i omfanget av “foreldre”Funksjon,“barn”Funksjon kan fortsatt få tilgang til verdien deres:

var displayMessage = funksjon ()
La info = 'Hei! Mitt navn er Alex.';
var show = funksjon ()
konsoll.logg (info);

forestilling();

Utgangen fra det gitte programmet betyr at "forestilling()”Som er en barnefunksjon, kan få tilgang til“info”Variabel erklært i“DisplayMessage ()”Foreldrefunksjon:

Det var all viktig informasjon relatert til JavaScript -stenginger. Du kan videre forske i henhold til dine krav.

Konklusjon

JavaScript -funksjoner også tjene som Stenginger Fordi kroppen til en funksjon har tilgang til variablene som er definert utenfor den. Vi kan definere Lukking som en barnefunksjon som kan få tilgang til variablene som er opprettet innenfor overordnede funksjonsomfang. Denne oppskrivningen er en komplett Nybegynnerguide til JavaScript -stenginger der vi har diskutert variabel tilgang innen forskjellige omfang.