Front end week 4: closures - Hoa0/project-tech GitHub Wiki
Closures
Binnen in JavaScript heb je een feature “closure”, waarbij een intern functie toegang heeft tot de variabelen van de buitenste functie. Functie worden omsloten door {}.
Closures heeft drie soorten scope skeletten:
- Het heeft toegang tot zijn eigen scope – variabelen zijn gedefinieerd tussen de accolades
{ } - Heeft toegang tot de variabele van de buitenste functie.
- Heeft toegang tot de globale variabelen.
Voorbeeld 1: closure In dit voorbeeld zijn twee functie weergegeven.
-
function outer()is het buitenste functie, die een variabelevar b = 10;heeft en defunction inner()teruggeeft. -
function inner ()heeft een variabelenvar a = 20;Deze functie heeft toegang tot de variabelenbdie in functie outer staat.
// bron: (Prashant Ram, 2018)
function outer() {
var b = 10;
function inner() {
var a = 20;
console.log(a+b);
}
return inner;
}
Voorbeelden: 2
//bron: (Developer Mozilla, 2021)
// global scope
var e = 10;
function sum(a){
return function(b){
return function(c){
// outer functions scope
return function(d){
// local scope
return a + b + c + d + e;
}
}
}
}
console.log(sum(1)(2)(3)(4)); // log 20
// You can also write without anonymous functions:
// global scope
var e = 10;
function sum(a){
return function sum2(b){
return function sum3(c){
// outer functions scope
return function sum4(d){
// local scope
return a + b + c + d + e;
}
}
}
}
var s = sum(1);
var s1 = s(2);
var s2 = s1(3);
var s3 = s2(4);
console.log(s3) //log 20
Bronnen
Developer Mozilla (2021), Geraadpleegd van, https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures
Prashant Ram (2018,16 januari). Geraadpleegd van, https://medium.com/@prashantramnyc/javascript-closures-simplified-d0d23fa06ba4