- In Javascript, a closure can be imagined as a concept of a function scope within a function.
- The global execution context can be treated as a whole function in which all the script contents are present, and when we run the script the global function is called.
(function () {
let k = 1;
function kd() {
console.log(`value of k is ${k}`);
}
kd();
})();
output:
value of k is 1
- the inner functions present in this function can access all the variables that are defined in the outer scope and can modify them.
- interestingly, these variables are still available even after the outer function has been executed and removed from memory.
function outer() {
let counter = 0;
function inner() {
counter++;
return counter;
}
return inner;
}
let instance = outer();
console.log(instance());
console.log(instance());
console.log(instance());
output:
1
2
3
- In the above code block, the outer function is called only once, while when we call the inner function multiple times the variable counter which is native to the outer function is modified by the inner function and value persists.
- This is conceptually similar to the context of methods and properties in a class where the methods can access and modify the variables of the class in an Object Oriented Language.
