In deze zelfstudie leert u met behulp van voorbeelden over JavaScript-sluitingen.
Voordat u meer over sluitingen leert, moet u twee concepten begrijpen:
- Geneste functie
- Een functie teruggeven
JavaScript geneste functie
In JavaScript kan een functie ook een andere functie bevatten. Dit wordt een geneste functie genoemd. Bijvoorbeeld,
// 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
In het bovenstaande programma greet()bevat de displayName()functie de functie erin.
Een functie teruggeven
In JavaScript kunt u ook een functie binnen een functie retourneren. Bijvoorbeeld,
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
Uitvoer
function displayName () (console.log ('Hallo' + '' + naam);) Hallo John
In het bovenstaande programma greet()retourneert de displayNamefunctie de functiedefinitie.
Hier wordt de geretourneerde functiedefinitie toegewezen aan de variabele g1. Wanneer u g1 met afdrukt console.log(g1), krijgt u de functiedefinitie.
Om de functie die is opgeslagen in de g1-variabele aan te roepen, gebruiken we g1()tussen haakjes.
JavaScript-sluitingen
In JavaScript geeft sluiting toegang tot de buitenste reikwijdte van een functie vanuit de innerlijke functie, zelfs nadat de uiterlijke functie is gesloten. Bijvoorbeeld,
// 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
Uitvoer
function displayName () // toegang tot naamvariabele retourneren 'Hallo' + '' + naam;) Hallo John
In het bovenstaande voorbeeld, wanneer een greet()functie wordt aangeroepen, retourneert het de functiedefinitie van displayName.
Hier g1is een verwijzing naar de displayName()functie.
Wanneer g1()wordt gebeld, heeft het nog steeds toegang tot de greet()functie.
Wanneer we uitvoeren console.log(g1), retourneert het de functiedefinitie.
Het concept van sluiting bestaat voor andere programmeertalen zoals Python, Swift, Ruby, etc.
Laten we naar een ander voorbeeld kijken.
// 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
In het bovenstaande programma neemt de calculate()functie een enkel argument xen retourneert de functiedefinitie van de multiply()functie. De multiply()functie heeft een enkel argument yen retourneert x * y.
Beide multiply3en multiply4zijn sluitingen.
De calculate()functie wordt aangeroepen door een parameter door te geven x. Wanneer multiply3en multiply4worden aangeroepen, heeft de multipy()functie toegang tot het doorgegeven x-argument van de buitenste calculate()functie.
Data Privacy
JavaScript-sluiting helpt bij de gegevensprivacy van het programma. Bijvoorbeeld,
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
In het bovenstaande voorbeeld sum()retourneert de functie de functiedefinitie van de increaseSum()functie.
De a-variabele wordt binnen de increaseSum()functie verhoogd . De waarde van de a-variabele kan echter ook buiten de functie worden gewijzigd. In dit geval a = a + 1;verandert de waarde van de variabele buiten de functie.
Als u nu wilt dat de a-variabele alleen binnen de functie wordt verhoogd, kunt u een sluiting gebruiken. Bijvoorbeeld,
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
In het bovenstaande voorbeeld stelt de sum()functie de waarde van a in op 0 en retourneert de increaseSum()functie.
Door de sluiting, ook al sum()is deze al uitgevoerd, increaseSum()heeft hij toch toegang tot a en kan hij 1 aan a toevoegen elke keer dat er x()wordt gebeld.
En de a-variabele is privé voor de sum()functie. Dit betekent dat de a-variabele alleen toegankelijk is binnen de sum()functie.
Zelfs als u het declareert aen gebruikt, heeft dit geen invloed op de avariabele in de sum()functie.
Opmerking : Over het algemeen worden sluitingen gebruikt voor gegevensprivacy.
