Special notes on Javascript
Clousers
- One way of supporting first-class functions
- A stack frame which is allocated when a function starts its execution, and not freed after the function returns.
- A closure is a function having access to the parent scope, even after the parent function has closed.
- In JavaScript, if you use the function keyword inside another function, you are creating a closure.
- The magic is that in JavaScript a function reference also has a secret reference to the closure it was created in — similar to how delegates are a method pointer plus a secret reference to an object.
function sayHello2(name) {
var text = 'Hello ' + name; // Local variable
var say = function() { console.log(text); }
return say;
}
var say2 = sayHello2('Bob');
say2(); // logs "Hello Bob"
A problem:
function add() {
var counter = 0;
function plus() {counter += 1;}
plus();
return counter;
}
add() // 1
add() // 1
Here we cannot increament the counter.
Solution with closure:
var add = ( function() {
counter = 0;
return function(){ return counter += 1;}
})();
add() // 1
add() // 2
add() // 3
- The self-invoking function only runs once. It sets the counter to zero (0), and returns a function expression.
- This way add becomes a function. The “wonderful” part is that it can access the counter in the parent scope.
- This is called a JavaScript closure. It makes it possible for a function to have Private variables.
- The counter is protected by the scope of the anonymous function, and can only be changed using the add function.
Sources:
- w3schools
- stackoverflow