Understanding
Scope in JavaScript

What is Scope in JavaScript?

In JavaScript, scope refers to the current context of execution — the space in which variables are defined and accessed. It determines the visibility and accessibility of variables.

There are mainly three types of scope in JavaScript:

• Global Scope
• Function (Local) Scope
• Block Scope (introduced with let and const in ES6)

1. Global Scope

Variables declared outside any function or block are in the global scope. They are accessible from anywhere in the code.

let globalVar = "I'm a global variable";

function printGlobal() {
  console.log(globalVar);
}

printGlobal();
console.log(globalVar);
    

I'm a global variable
I'm a global variable

Question: Can you access globalVar inside the function?

Answer: Yes! Because it's declared in the global scope, it is accessible inside functions as well.

2. Function Scope (Local Scope)

Variables declared with var, let, or const inside a function are only available within that function.

function greet() {
  let message = "Hello!";
  console.log(message);
}

greet();
console.log(message); // Error
    

Hello!
Uncaught ReferenceError: message is not defined

Question: Why do we get an error on the last line?

Answer: Because message is declared inside the function greet(), it's not accessible outside its scope.

3. Block Scope

With ES6, let and const introduced block scope. This means variables are only accessible within the curly braces {} they are defined in.

{
  let blockScoped = "I'm inside a block";
  console.log(blockScoped);
}

console.log(blockScoped); // Error
    

I'm inside a block
Uncaught ReferenceError: blockScoped is not defined

Tip: Always use let or const for variable declarations to avoid unintentional global or function scoping with var.

4. Scope Chain

If a variable is not found in the current scope, JavaScript looks outward through the scope chain until it finds it — or reaches the global scope.

let outer = "I'm outer";

function first() {
  let inner = "I'm inner";

  function second() {
    console.log(outer); // Accessible
    console.log(inner); // Accessible
  }

  second();
}

first();
    

I'm outer
I'm inner

Question: Can inner functions access outer variables?

Answer: Yes! This is called lexical scoping, where inner functions have access to variables defined in their outer scopes.

5. Shadowing Variables

When a variable declared in an inner scope has the same name as a variable in an outer scope, the inner variable "shadows" the outer one.

let value = "outer";

function test() {
  let value = "inner";
  console.log(value);
}

test();
console.log(value);
    

inner
outer

Explanation: The variable value inside the function doesn't affect the outer value. They live in different scopes.

Conclusion

• Global scope is accessible everywhere.
• Function scope confines variables to the function body.
• Block scope limits variable access to the block in which they're declared (with let/const).
• JavaScript resolves variable access using the scope chain.
• Always prefer let or const over var to avoid bugs due to hoisting and scoping quirks.