var makeCounter = function() {<br /> var privateCounter = 0;<br /> function changeBy(val) {<br /> privateCounter += val;<br /> }<br /> return {<br /> increment: function() {<br /> changeBy(1);<br /> },<br /> decrement: function() {<br /> changeBy(-1);<br /> },<br /> value: function() {<br /> return privateCounter;<br /> }<br /> }<br /> };</p> <p>var counter1 = makeCounter();<br /> var counter2 = makeCounter();<br /> alert(counter1.value()); /* Alerts 0 */<br /> counter1.increment();<br /> counter1.increment();<br /> alert(counter1.value()); /* Alerts 2 */<br /> counter1.decrement();<br /> alert(counter1.value()); /* Alerts 1 */<br /> alert(counter2.value()); /* Alerts 0 */<br />

function makeAdder(x) {<br /> return function(y) {<br /> return x + y;<br /> };<br /> }</p> <p>var add5 = makeAdder(5);<br /> var add10 = makeAdder(10);</p> <p>console.log(add5(2)); // 7<br /> console.log(add10(2)); // 12

// A closure is a function having access to the parent scope,<br /> // even after the parent function has popped.</p> <p>function greeting() {<br /> let message=”Hi”;</p> <p> function sayHi() {<br /> console.log(message);<br /> }</p> <p> return sayHi;<br /> }<br /> let hi = greeting();<br /> hi(); // still can access the message variable

function makeAdder(x) {<br /> return function(y) {<br /> return x + y;<br /> };<br /> }</p> <p>var add5 = makeAdder(5);<br /> var add10 = makeAdder(10);</p> <p>console.log(add5(2)); // 7<br /> console.log(add10(2)); // 12</p> <p>//my words: what this code do is basically a nested function that will return<br /> //its inner function (un-activated). So var add5 in line 7 activated the outer<br /> //function with 5 as parameter which makes add5 is now the nameless function at<br /> //line 2 that will return 5 + y;</p> <p>//MDN words:<br /> //add5 and add10 are both closures. They share the same function body<br /> //definition, but store different lexical environments. In add5’s lexical<br /> //environment, x is 5, while in the lexical environment for add10, x is 10.

let counter = (function() {<br /> let i = 0; // private property</p> <p> return { // public methods<br /> get: function() {<br /> alert(i);<br /> },<br /> set: function(value) {<br /> i = value;<br /> },<br /> increment: function() {<br /> alert(++i);<br /> }<br /> };<br /> })(); // module</p> <p>counter.get(); // shows 0<br /> counter.set(6);<br /> counter.increment(); // shows 7<br /> counter.increment(); // shows 8

function outer() {<br /> var counter = 0; // Backpack or Closure<br /> function incrementCounter() {<br /> return counter++;<br /> }<br /> return incrementCounter;<br /> }</p> <p>const count = outer();<br /> count(); // 0<br /> count(); // 1<br /> count(); // 2

function makeAdder(x) {<br /> return function(y) {<br /> return x + y;<br /> };<br /> }</p> <p>var add5 = makeAdder(5);<br /> var add10 = makeAdder(10);</p> <p>console.log(add5(2)); // 7<br /> console.log(add10(2)); // 12</p> <p>//=====<br /> //add5 and add10 are both closures.<br /> //They share the same function body definition, but store different lexical environments.<br /> //In add5’s lexical environment, x is 5, while in the lexical environment for add10, x is 10.<br />

// global scope<br /> var e = 10;<br /> function sum(a){<br /> return function(b){<br /> return function(c){<br /> // outer functions scope<br /> return function(d){<br /> // local scope<br /> return a + b + c + d + e;<br /> }<br /> }<br /> }<br /> }</p> <p>console.log(sum(1)(2)(3)(4)); // log 20</p> <p>// You can also write without anonymous functions:</p> <p>// global scope<br /> var e = 10;<br /> function sum(a){<br /> return function sum2(b){<br /> return function sum3(c){<br /> // outer functions scope<br /> return function sum4(d){<br /> // local scope<br /> return a + b + c + d + e;<br /> }<br /> }<br /> }<br /> }</p> <p>var sum2 = sum(1);<br /> var sum3 = sum2(2);<br /> var sum4 = sum3(3);<br /> var result = sum4(4);<br /> console.log(result) //log 20<br />

function numberGenerator() {<br /> // Local “free” variable that ends up within the closure<br /> var num = 1;<br /> function checkNumber() {<br /> console.log(num);<br /> }<br /> num++;<br /> return checkNumber;<br /> }</p> <p>var number = numberGenerator();<br /> number(); // 2

function makeFunc() {<br /> var name=”Mozilla”;<br /> function displayName() {<br /> alert(name);<br /> }<br /> return displayName;<br /> }</p> <p>var myFunc = makeFunc();<br /> myFunc();