A closure gives you access to an outer function’s scope from an inner function

//example

function init() {

  var name = 'Mozilla'; // name is a local variable created by init

  function displayName() { // displayName() is the inner function, a closure

    alert(name); // use variable declared in the parent function

  }

  displayName();

}

init();

​

// A closure is a function having access to the parent scope, 

// even after the parent function has popped.

​

function greeting() {

    let message = 'Hi';

​

    function sayHi() {

        console.log(message);

    }

​

    return sayHi;

}

let hi = greeting();

hi(); // still can access the message variable

-->closure in javascript

//closure is the combination of function and the lexical enviornment in

//which the function is defined.closure give you access to the functions

//and variables outside the function.

function outer(){

  const outerData ="outer";

  function inner(){

    const innerData="inner";

    console.log(`${outerData} and{innerData}`);

  }

  inner();

}

outer();

function makeAdder(x) {

  return function(y) {

    return x + y;

  };

}

​

var add5 = makeAdder(5);

var add10 = makeAdder(10);

​

console.log(add5(2));  // 7

console.log(add10(2)); // 12

function makeFunc() {

  var name = 'Mozilla';

  function displayName() {

    alert(name);

  }

  return displayName;

}

​

var myFunc = makeFunc();

myFunc();

​

function outerFunction() {

  var outerVariable = 'I am an outer variable';

​

  function innerFunction() {

    var innerVariable = 'I am an inner variable';

    console.log(outerVariable);

  }

​

  return innerFunction;

}

​

var closureExample = outerFunction();

closureExample();

let counter = (function() {

    let i = 0; // private property

​

    return {   // public methods

        get: function() {

            alert(i);

        },

        set: function(value) {

            i = value;

        },

        increment: function() {

            alert(++i);

        }

    };

})(); // module

​

counter.get();      // shows 0

counter.set(6);

counter.increment(); // shows 7

counter.increment(); // shows 8

function makeFunc() {

  var name = 'Mozilla';

  function displayName() {

    alert(name);

  }

  return displayName;

}

​

var myFunc = makeFunc();

myFunc();

function makeAdder(x) {

  return function(y) {

    return x + y;

  };

}

​

var add5 = makeAdder(5);

var add10 = makeAdder(10);

​

console.log(add5(2));  // 7

console.log(add10(2)); // 12

​

//my words: what this code do is basically a nested function that will return

//its inner function (un-activated). So var add5 in line 7 activated the outer

//function with 5 as parameter which makes add5 is now the nameless function at

//line 2 that will return 5 + y;

​

//MDN words:

//add5 and add10 are both closures. They share the same function body

//definition, but store different lexical environments. In add5's lexical

//environment, x is 5, while in the lexical environment for add10, x is 10.

// 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 sum2 = sum(1);

var sum3 = sum2(2);

var sum4 = sum3(3);

var result = sum4(4);

console.log(result) //log 20

​