# Closures in JavaScript

When I first started to read about closures, I realized I'd been using them for a very long time but, I just didn't know they were called so. It was only recently that I understood the significance and proper use of closures. Here are some of my learnings: 

#### Lexical Environment and Scoping

A lexical environment is a construct used to keep track of the mapping from identifiers to specific variables.
Every time a program executes, a lexical environment is created which keeps track of all the identifiers and also stores references to the parent lexical environment.

Scope is a language agnostic concept, it refers to the visibility of variables or functions to the executing code. In JavaScript, a variable or function is visible to the executing code, if it is there in the current lexical environment or in the lexical-environment-chain of the enclosing function. In case of global code, this chain does not exist.


#### Closures 
> A closure is the combination of a function and the lexical environment within which that function was declared.

A function has access to all the variables inside it - 

function example() {
  let a = 4;
  return a * a;
}

Similarly, a function has access to variables outside it because to the function they feel like global variables

let a = 4;
function example() {
  return a * a;
}

Therefore, the scope of variable a allows function *example* to have access to it's value. 

> Closures are useful because they let you associate data (the lexical environment) with a function that operates on that data. This has obvious parallels to object-oriented programming, where objects allow you to associate data (the object's properties) with one or more methods.

#### Imitating private methods with closures

Private methods don't just restrict access to code. They also provide a way of managing your global namespace.
Let's take the example of a counter problem (inspired by other sources)- 

```
let counter = 0;
function count() {
  counter ++;
}

// Call count() 3 times
count();
count();
count();

// The counter should now be 3
```

The problem here is that counter is a public variable. Any function can change the value of the counter variable. The variable counter should be private to the function count() to add value. 


Let's look at another solution -

```
function count() {
  let counter = 0;
  counter += 1;
  return counter;
}

// Call count() 3 times
count();
count();
count();

// The counter is 1
```

The expected output should be 3 but each time we call count(), we reset the counter to 0. Thus, not solving the problem at hand.
This is where closures come into the picture.

In JavaScript, a closure is a function that references variables in the outer scope from its inner scope. The closure preserves the outer scope inside its inner scope.

```
function count() {
  let counter = 0;
  return function () {counter += 1; return counter}
};
```

The inner anonymous function preserves the value of the variable counter, thus making it private to the function. In other words, the function acts like a closure for the variable counter. We cannot reference the variable counter outside the function count.

Thus, closures are nothing but functions that let us emulate the behavior of private variables.