JavaScript, Lexical vs Dynamic Scope

Lexical vs Dynamic Scope
Explain Dynamic Scope vs Lexical Scope in JavaScript by some examples.
Answer: In JavaScript, the concepts of scope determine how variable names are resolved in nested functions. There are two main types of scope: lexical scope (also known as static scope) and dynamic scope. JavaScript uses lexical scope.Lexical scope means that the scope of a variable is determined by its position in the source code. When a function is defined, it captures the variables in its surrounding scope at that time. This scope doesn't change when the function is called from a different context.javascript
function outerFunction() {
let outerVar = 'I am from the outer scope';
function innerFunction() {
console.log(outerVar); // Accesses outerVar from the outerFunction's scope
}
innerFunction();
}
outerFunction(); // Output: "I am from the outer scope"

In this example, 'innerFunction' can access 'outerVar' because 'outerVar' is within its lexical scope. The scope is determined when 'innerFunction' is defined, not when it is called.javascript
let globalVar = 'I am a global variable';
function outerFunction() {
let outerVar = 'I am from the outer scope';
function innerFunction() {
let innerVar = 'I am from the inner scope';
console.log(globalVar); // Accesses globalVar
console.log(outerVar); // Accesses outerVar from outerFunction's scope
console.log(innerVar); // Accesses innerVar from innerFunction's scope
}
innerFunction();
}
outerFunction();
// Output:
// "I am a global variable"
// "I am from the outer scope"
// "I am from the inner scope"
Dynamic scope means that the scope of a variable is determined by the call stack at runtime, not by the lexical structure of the code. JavaScript does not use dynamic scope, but some languages like Lisp or Perl can use it.Imagine if JavaScript had dynamic scope:
javascript
function outerFunction() {
let outerVar = 'I am from the outer scope';
function innerFunction() {
console.log(outerVar); // Hypothetically, this would refer to the closest outerVar in the call stack
}
return innerFunction;
}
let anotherOuterVar = 'I am from another outer scope';
let fn = outerFunction();
fn(); // If JavaScript had dynamic scope, this might output "I am from another outer scope"

In this hypothetical example, if JavaScript had dynamic scope, the 'outerVar' inside 'innerFunction' would refer to the closest 'outerVar' in the call stack at the time of the function call, not at the time of definition. However, since JavaScript uses lexical scope, the function 'fn' will output "I am from the outer scope".- Lexical Scope: The scope is determined by the code's structure. A function's scope depends on where it is defined.
- Dynamic Scope: The scope is determined by the call stack at runtime. A function's scope depends on where it is called.
JavaScript uses lexical scope, meaning functions remember the scope in which they were defined, not where they are called from.