39 Closures

1. Lexical Scope

• Lexical scope, also known as static scope, is a concept that determines the visibility and accessibility of variables
• and identifiers based on their location in the source code at the time of compilation or parsing.
• When a variable is defined within a block or a function, its scope is limited to that block or function,
• and it is not accessible outside of it.

function outerFunction() {
  var outerVariable = "I am outside!";

  function innerFunction() {
    console.log(outerVariable);
  }

  innerFunction();
}

outerFunction(); // Output: I am outside!

• The innerFunction is nested within outerFunction and has access to the outerVariable because of lexical scoping.
• The innerFunction can reference variables from its outer scope, but variables defined inside innerFunction are not accessible outside of it.
• Lexical scope ensures that variables defined in an outer scope are accessible within inner scopes, but variables defined in an inner scope are not accessible in outer scopes.
• This mechanism helps in organizing and encapsulating code and prevents naming conflicts between different parts of the program.
• Lexical scope is determined at the time of code compilation or parsing and remains fixed throughout the lifetime of the program.

2. Closures

• A closure is a function & references to its surrounding state (the lexical environment) bundled together
• In other words, a closure gives you access to an outer function's scope from an inner function.
• It allows a function to access variables from its outer (enclosing) scope even after the outer function has finished executing.

function outerFunction() {
  var outerVariable = "I am outside!";

  function innerFunction() {
    console.log(outerVariable);
  }

  return innerFunction;
}

var closure = outerFunction();
closure(); // Output: I am outside!

• Closures are created when a function is defined inside another function
• The innerFunction has access to the outerVariable even after outerFunction has finished executing and returned.
• When we call outerFunction, it returns the innerFunction, which we assign to the variable closure.
• We can then invoke closure, and it will still have access to the outerVariable from its enclosing scope.
• This is possible because closure retains a reference to the environment in which it was created.
• They provide a way to encapsulate data and behavior, allowing functions to access and manipulate that data while keeping it hidden from the global scope.
• A closure is created when an inner function references variables from its outer scope,
• and that inner function is returned or accessed outside of its original lexical scope. T
• The closure retains a reference to the environment (variables, functions, etc.) in which it was created.

function outerFunction(x) {
  function innerFunction() {
    return x;
  }
  return innerFunction;
}

const closure = outerFunction(10);
console.log(closure()); // outputs 10

• Closures are useful because they allow inner functions to retain access to the variables and parameters of the outer function, even after the outer function has completed execution.
• This can be useful for creating functions that need to access and manipulate variables that are defined in a higher scope.