Scope and Closures

Variable Scope:

Variable Scope:

  • Variables declared outside of any function or block have global scope.
  • They are accessible throughout the entire program.
                                      
                                        let globalVariable = "I'm global";

function exampleFunction() {
    console.log(globalVariable);  // Accessible here
}

Local Scope:

  • Variables declared inside a function have local scope.
  • They are only accessible within that function.
                                          
                                            function exampleFunction() {
                                                let localVariable = "I'm local";
                                                console.log(localVariable);  // Accessible here
                                            
                                                // Nested function with its own local scope
                                                function nestedFunction() {
                                                    console.log(localVariable);  // Accessible here too
                                                }
                                            }
                                            
                                            console.log(localVariable);  // Error: localVariable is not defined

Block Scope (introduced with ES6):

  • Variables declared with let and const have block scope.
  • They are accessible only within the block where they are defined.
                                          
                                            if (true) {
                                                let blockVariable = "I'm in a block";
                                                console.log(blockVariable);  // Accessible here
                                            }
                                            
                                            console.log(blockVariable);  // Error: blockVariable is not defined

Closures:

A closure is a function that is able to ‘reach into’ the outer function and use its variables even after the program has moved on to other steps. This enables one to define such variables for the private use and to have specific functions or even operations.

                                          
                                            function outerFunction() {
                                                let outerVariable = "I'm from the outer function";
                                            
                                                function innerFunction() {
                                                    console.log(outerVariable);  // Access outerVariable from the outer function
                                                }
                                            
                                                return innerFunction;
                                            }
                                            
                                            const closureFunction = outerFunction();
                                            closureFunction();  // Logs: I'm from the outer function

In this example, innerFunction forms a closure over outerVariable. Even after outerFunction has finished executing, closureFunction still has access to outerVariable.


Closures are often used to create private variables and functions:

                                      
                                        function createCounter() {
                                            let count = 0;
                                        
                                            return function() {
                                                count++;
                                                console.log(count);
                                            };
                                        }
                                        
                                        const counter = createCounter();
                                        counter();  // Logs: 1
                                        counter();  // Logs: 2

Here, createCounter returns a closure that maintains its own private count variable.

Understanding variable scope and closures is crucial for writing clean and efficient JavaScript code.