U ovom ćete tutorijalu uz primjere naučiti o zatvaranju JavaScript-a.
Prije nego što naučite o zatvaranju, morate razumjeti dva pojma:
- Ugniježđena funkcija
- Vraćanje funkcije
JavaScript ugniježđena funkcija
U JavaScriptu funkcija može sadržavati i drugu funkciju. To se naziva ugniježđena funkcija. Na primjer,
// 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
U gornjem programu greet()funkcija sadrži displayName()funkciju unutar nje.
Vraćanje funkcije
U JavaScriptu također možete vratiti funkciju unutar funkcije. Na primjer,
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
Izlaz
funkcija displayName () (console.log ('Hi' + '' + name);) Bok John
U gornjem programu greet()funkcija vraća displayNamedefiniciju funkcije.
Ovdje je vraćena definicija funkcije dodijeljena varijabli g1. Kada ispisujete g1 pomoću console.log(g1), dobit ćete definiciju funkcije.
Da bismo pozvali funkciju pohranjenu u varijabli g1, koristimo g1()u zagradama.
Zatvaranje JavaScript-a
U JavaScriptu zatvaranje omogućuje pristup vanjskom opsegu funkcije iz unutarnje funkcije, čak i nakon zatvaranja vanjske funkcije. Na primjer,
// 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
Izlaz
funkcija displayName () (// pristup varijabli imena return 'Hi' + '' + name;) Bok John
U gornjem primjeru, kada je greet()funkcija pozvana, ona vraća definiciju funkcije displayName.
Evo g1reference na displayName()funkciju.
Kad g1()je pozvan, i dalje ima pristup greet()funkciji.
Kada pokrenemo console.log(g1), vraća definiciju funkcije.
Koncept zatvaranja postoji za druge programske jezike kao što su Python, Swift, Ruby itd.
Pogledajmo još jedan primjer.
// 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
U gore navedenom programu calculate()funkcija uzima jedan argument xi vraća definiciju multiply()funkcije funkcije. multiply()Funkcija uzima jedan argument yi vraća x * y.
I jedno multiply3i drugo multiply4su zatvaranja.
calculate()Funkcija se zove prolazi parametar x. Kad multiply3te multiply4zovu je multipy()funkcija ima pristup položenom x argument vanjske calculate()funkcije.
Privatnost podataka
Zatvaranje JavaScripta pomaže u privatnosti podataka programa. Na primjer,
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
U gornjem primjeru sum()funkcija vraća definiciju increaseSum()funkcije funkcije.
Varijabla je povećana unutar increaseSum()funkcije. Međutim, vrijednost varijable također se može mijenjati izvan funkcije. U ovom slučaju, a = a + 1;mijenja vrijednost varijable izvan funkcije.
Ako želite da se varijabla povećava samo unutar funkcije, možete upotrijebiti zatvaranje. Na primjer,
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
U gornjem primjeru sum()funkcija postavlja vrijednost a na 0 i vraća increaseSum()funkciju.
Zbog zatvaranja, iako sum()je već izvršeno, i increaseSum()dalje ima pristup a i može dodati 1 svakom x()pozivu.
A varijabla je privatna za sum()funkciju. To znači da se varijabli može pristupiti samo unutar sum()funkcije.
Čak i ako ga deklarirate ai koristite, to ne utječe na avarijablu unutar sum()funkcije.
Napomena : Općenito se zatvarači koriste za privatnost podataka.
