|
| 1 | +## Only the important new concepts |
| 2 | + |
| 3 | +- Closures are used in encapsulation and data hiding. |
| 4 | + |
| 5 | +``` |
| 6 | +(without closures) |
| 7 | +var count = 0; |
| 8 | + |
| 9 | +function increment(){ |
| 10 | + count++; |
| 11 | +} |
| 12 | + |
| 13 | +in this code, anyone can access count and change it. |
| 14 | + |
| 15 | +(with closures) -> put everything into a function |
| 16 | + |
| 17 | +function counter() { |
| 18 | + var count = 0; |
| 19 | + |
| 20 | + function increment(){ |
| 21 | + count++; |
| 22 | + } |
| 23 | +} |
| 24 | +console.log(count); // this will give referenceError as count can't be accessed. |
| 25 | + |
| 26 | +(inc with function using closure) |
| 27 | + |
| 28 | +function counter() { |
| 29 | + var count = 0; |
| 30 | + return function increment(){ |
| 31 | + count++; |
| 32 | + console.log(count); |
| 33 | + } |
| 34 | +} |
| 35 | +var counter1 = counter(); //counter fun has closure with count var. |
| 36 | +counter1(); // increments counter |
| 37 | + |
| 38 | +Above code is not good and scalable for say, when you plan to implement decrement counter at a later stage. |
| 39 | +To address this issue, we use constructors |
| 40 | + |
| 41 | +Adding decrement counter and refactoring code: |
| 42 | + |
| 43 | +function Counter() { //constructor function. Good coding would be to capitalize first letter of ctor fun. |
| 44 | + var count = 0; |
| 45 | + this.incrementCounter = function(){ //anonymous function |
| 46 | + count++; |
| 47 | + console.log(count); |
| 48 | + } |
| 49 | + this.decrementCounter = function(){ |
| 50 | + count--; |
| 51 | + console.log(count); |
| 52 | + } |
| 53 | +} |
| 54 | + |
| 55 | +var counter1 = new Counter(); // new keyword for ctor fun |
| 56 | +counter1.incrementCounter(); |
| 57 | +counter1.incrementCounter(); |
| 58 | +counter1.decrementCounter(); |
| 59 | + |
| 60 | +// returns 1 2 1 |
| 61 | + |
| 62 | +``` |
| 63 | +### Disadvantages of closure |
| 64 | +- Overconsumption of memory when using closure as everytime as those closed over variables are not garbage collected till program expires. |
| 65 | +So when creating many closures, more memory is accumulated and this can create memory leaks if not handled. |
| 66 | +- **Garbage collector : **Program in JS engine or browser that frees up unused memory. In highlevel languages like C++ or JAVA, garbage collection is left to the |
| 67 | +programmer, but in JS engine its done implicitly. |
| 68 | + |
| 69 | +``` |
| 70 | +function a() { |
| 71 | + var x = 0; |
| 72 | + return function b() { |
| 73 | + console.log(x); |
| 74 | + } |
| 75 | + } |
| 76 | + |
| 77 | + var y = a(); // y is a copy of b() |
| 78 | + y(); |
| 79 | + |
| 80 | + Once a() is called, its element x should be garbage collected ideally. But fun b has closure over var x. So mem of x cannot be freed. |
| 81 | + Like this if more closures formed, it becomes an issue. To tacke this, JS engines like v8 and Chrome have smart garbage collection mechanisms. |
| 82 | + Say we have var x = 0, z = 10 inabove code. When console log happens, x is printed as 0 but z is removed automatically. |
| 83 | + |
0 commit comments