1. Global Scope:
-> Variables or functions declared outside of any function or block have global scope.
-> They can be accessed from anywhere in the code, including inside -> functions or blocks.
-> Global variables can create issues, especially in large programs, as they are accessible everywhere and can be overwritten.
var globalVar = "I'm a global variable";
function displayGlobalVar() {
console.log(globalVar); // Accessible here
}
displayGlobalVar(); // Output: I'm a global variable
2. Function Scope:
-> Variables declared within a function are scoped to that function.
They are not accessible outside the function in which they are defined
function myFunction() {
var functionVar = "I'm a function variable";
console.log(functionVar); // Accessible here
}
myFunction();
console.log(functionVar); // Error: functionVar is not defined
-> In the example above, functionVar is not accessible outside of myFunction().
3. Block Scope (introduced in ES6):
-> Variables declared using let and const are block-scoped.
They are only accessible within the block (e.g., { }) in which they are defined.
if (true) {
let blockVar = "I'm a block variable";
console.log(blockVar); // Accessible here
}
console.log(blockVar); // Error: blockVar is not defined
-> Variables declared with var, however, are not block-scoped; they are function-scoped.
if (true) {
var notBlockVar = "I'm not block-scoped";
}
console.log(notBlockVar); // Output: I'm not block-scoped
4. Lexical Scope:
-> Lexical scope (also known as static scope) refers to the fact that a function's scope is determined by where it is defined in the code, not where it is called.
-> Inner functions have access to variables of outer functions.
function outerFunction() {
var outerVar = "I'm an outer variable";
function innerFunction() {
console.log(outerVar); // Accessible here
}
innerFunction(); // Output: I'm an outer variable
}
outerFunction();
5. Closures:
-> A closure is a function that retains access to its lexical scope, even when the function is executed outside that scope.
-> Closures allow a function to access variables from an outer function even after the outer function has returned.
function outerFunction() {
var outerVar = "I'm an outer variable";
return function innerFunction() {
console.log(outerVar); // Still accessible here
};
}
var closureFunction = outerFunction();
closureFunction(); // Output: I'm an outer variable
-> In the example above, innerFunction forms a closure that allows it to access outerVar even after outerFunction has finished executing.
Summary:
- Global Scope: Accessible from anywhere in the code.
- **Function Scope: **Accessible only within the function where defined.
- Block Scope: Accessible only within the block where defined (let, const).
- Lexical Scope: Functions have access to variables in the scope where they were defined.
- Closures: Functions that "remember" their lexical scope even after the outer function has finished.
-> Understanding scope is crucial for managing variable lifetimes and ensuring that your code behaves as expected.
Top comments (0)