Lexical Scope in Javascript
Scope
Scope defines the region of a program where a particular variable can be accessed or modified. It is a critical concept in programming languages, ensuring that variables are used in a controlled and organized manner. The primary goal of scoping is to manage the visibility and lifetime of variables, preventing unintended conflicts or overwrites.
Types of Scope:
There are two main types of scope in programming languages: lexical scope and global scope. And local scope and block scope
What is Lexical Scope in Javascript?
Lexical scope, often referred to as static scope, is a scope determined at compile time-based on the program’s structure. In simpler terms, it is about where a variable is declared in the code. The lexical scope of a variable is fixed by its location in the source code and remains unchanged during runtime.
EXAMPLE:
function abc(){
I var a=5; // lexical scope
function xyz(){
console.log(a); // lexical environment
}
xyz();
}
abc() // output 5
Benefits of Lexical Scope
- Organization:
- Lexical scope helps keep things organized. Variables are like ingredients in specific cabinets (scopes), making it easier to find and manage them.
- Avoiding Confusion:
- Each part of the code knows where to look for variables. This reduces confusion and prevents mix-ups, like grabbing salt when you need sugar.
- Reusable Recipes (Functions):
- Functions can use ingredients from their own recipe (local scope) and any outer recipes (outer scopes). This reusability makes your code more efficient.
- Memory (Closures):
- Closures allow functions to remember things, like a kitchen helper remembering ingredients. This is handy for certain tasks, and it keeps your code flexible.
EXAMPLE:
function outer() {
let x = 10;
function inner() {
let y = 5;
console.log(x + y);
}
inner();
}
outer();
Lexical environment in Javascript
A lexical environment is like a container that stores the names of variables and functions in a program, along with their corresponding references to actual objects, such as values or functions. Think of it as a place where these variables and functions reside during the execution of a program.
In simpler terms, a lexical environment is where the program keeps track of its variables and functions while running. It’s like a neighborhood where each block has its own local memory, and they know about the surrounding blocks’ memories too.
function outerFun() {
// Outer lexical environment
let outerVariable = 'I am in the outer function';
function innerFun() {
// Inner lexical environment
let innerVariable = 'I am in the inner function';
console.log(outerVariable);
console.log(innerVariable);
}
inner Fun();
}
outerFun();
Global scope
The global scope in programming refers to the outermost scope of a program, where variables are declared outside of any function or block. Variables defined in the global scope are accessible throughout the entire program, including within functions and blocks. Understanding the global scope is crucial for managing variable visibility, preventing naming conflicts, and ensuring the proper functioning of a program.
let globalVariable="I am in the global scope"
function accessGlobalVariable() {
console.log(globalVariable);
}
accessGlobalVariable();
// Modifying the global variable
globalVariable = "I have been modified in the global scope";
// Logging the modified global variable
console.log(globalVariable);
//output
I am in the global scope
I have been modified in the global scope
Local scope
Local scope refers to the region or context within a program where a variable is declared. Variables declared in a local scope are only accessible within that specific scope, such as within a function or a block of code. Once you exit the function or block, the local variables typically go out of scope, and their values may no longer be accessible.
function LocalScopeFunction() {
// Local scope variable
let localVariable = "I am in the local scope";
console.log(localVariable);
}
Block scope
Block scope is a programming concept where variables are accessible only within a specific block of code, typically denoted by curly braces {}. This scope is in contrast to the broader scope of a function or the global scope and is a feature introduced in some programming languages to provide more fine-grained control over variable visibility and lifetime.
if (true) {
let blockVariable = "I am in a block scope";
console.log(blockVariable);
}
//output: I am in a block scope
Join our Best MERN Stack Course program and become an expert in web development career. This Course is for beginners who want to learn web development from the Basics. We cover all the aspects of web development. This Course is fully packed with amazing content. This Prgram is design according to industry requirements and understands the concepts faster.