I denne veiledningen lærer du om JavaScript-lukking ved hjelp av eksempler.
Før du lærer om nedleggelser, må du forstå to konsepter:
- Nestet funksjon
- Returnerer en funksjon
JavaScript nestet funksjon
I JavaScript kan en funksjon også inneholde en annen funksjon. Dette kalles en nestet funksjon. For eksempel,
// nested function example // outer function function greet(name) ( // inner function function displayName() ( console.log('Hi' + ' ' + name); ) // calling inner function displayName(); ) // calling outer function greet('John'); // Hi John
I programmet ovenfor greet()inneholder displayName()funksjonen funksjonen inne i den.
Returnere en funksjon
I JavaScript kan du også returnere en funksjon i en funksjon. For eksempel,
function greet(name) ( function displayName() ( console.log('Hi' + ' ' + name); ) // returning a function return displayName; ) const g1 = greet('John'); console.log(g1); // returns the function definition g1(); // calling the function
Produksjon
function displayName () (console.log ('Hi' + '' + name);) Hei John
I programmet ovenfor greet()returnerer displayNamefunksjonen funksjonsdefinisjonen.
Her tildeles den returnerte funksjonsdefinisjonen til g1-variabelen. Når du skriver ut g1 med console.log(g1), får du funksjonsdefinisjonen.
For å ringe til funksjonen som er lagret i g1-variabelen, bruker vi g1()med parenteser.
JavaScript-lukkinger
I JavaScript gir lukking tilgang til det ytre omfanget av en funksjon fra innsiden av den indre funksjonen, selv etter at den ytre funksjonen er lukket. For eksempel,
// javascript closure example // outer function function greet() ( // variable defined outside the inner function let name = 'John'; // inner function function displayName() ( // accessing name variable return 'Hi' + ' ' + name; ) return displayName; ) const g1 = greet(); console.log(g1); // returns the function definition console.log(g1()); // returns the value
Produksjon
funksjon displayName () (// tilgang til navnevariabelen returnerer 'Hei' + '' + navn;) Hei John
I eksemplet ovenfor, når greet()funksjon kalles, returnerer den funksjonsdefinisjonen av displayName.
Her g1er en referanse til displayName()funksjonen.
Når g1()kalles, har den fremdeles tilgang til greet()funksjonen.
Når vi løper console.log(g1), returnerer den funksjonsdefinisjonen.
Begrepet lukking eksisterer for andre programmeringsspråk som Python, Swift, Ruby, etc.
La oss ta en titt på et annet eksempel.
// closure example function calculate(x) ( function multiply(y) ( return x * y; ) return multiply; ) const multiply3 = calculate(3); const multiply4 = calculate(4); console.log(multiply3); // returns calculate function definition console.log(multiply3()); // NaN console.log(multiply3(6)); // 18 console.log(multiply4(2)); // 8
I programmet ovenfor calculate()tar funksjonen et enkelt argument xog returnerer funksjonsdefinisjonen til multiply()funksjonen. Den multiply()funksjonen tar en enkelt argument yog returnerer x * y.
Begge multiply3og multiply4er nedleggelser.
Den calculate()funksjonen kalles passerer en parameter x. Når multiply3og multiply4kalles, har multipy()funksjonen tilgang til det passerte x-argumentet til den ytre calculate()funksjonen.
Personvern
JavaScript-lukking hjelper deg med å beskytte personvernet til programmet. For eksempel,
let a = 0; function sum() ( function increaseSum() ( // the value of a is increased by 1 return a = a + 1; ) return increaseSum; ) const x = sum(); console.log(x()); // 1 console.log(x()); // 2 console.log(x()); // 3 a = a + 1; console.log(a); // 4
I eksemplet ovenfor sum()returnerer funksjonen funksjonsdefinisjonen til increaseSum()funksjonen.
Variabelen a økes inne i increaseSum()funksjonen. Verdien til en variabel kan imidlertid også endres utenfor funksjonen. I dette tilfellet a = a + 1;endrer verdien på variabelen utenfor funksjonen.
Nå, hvis du vil at en variabel bare skal økes i funksjonen, kan du bruke en lukking. For eksempel,
function sum() ( let a = 0; function increaseSum() ( // the value of a is increased by 1 return a = a + 1; ) return increaseSum; ) let x = sum(); let a = 5; console.log(x()); // 1 console.log(x()); // 2 console.log(a); // 5
I eksemplet ovenfor sum()setter funksjonen verdien til a til 0 og returnerer increaseSum()funksjonen.
Selv om sum()det allerede er utført, på grunn av nedleggelsen, increaseSum()har det fortsatt tilgang til a og kan legge til 1 til en hver gang det x()blir ringt.
Og a-variabelen er privat for sum()funksjonen. Det betyr at en variabel bare er tilgjengelig inne i sum()funksjonen.
Selv om du erklærer aog bruker den, påvirker den ikke avariabelen inne i sum()funksjonen.
Merk : Vanligvis brukes nedleggelser for personvern.
