Scope in JavaScript

Scope defines where a variable can be accessed in your program.
It helps JavaScript decide which variables are visible and which are not at a particular place in the code.

Understanding scope is very important because it prevents errors, avoids conflicts between variable names, and helps you write clean, predictable programs.
For college students and freshers, scope is a must-know topic before moving to advanced JavaScript.

In this chapter, you will learn:

• Block Scope

• Function Scope

• Global Scope

• var vs let vs const in scope

Let’s break everything down in simple words.

What Is Scope?

Scope means the area where a variable is available.

Think of scope like boundaries:

• Variables inside a small block can’t be accessed outside.

• Variables inside a function belong only to that function.

• Variables declared outside everything are available everywhere.

1. Block Scope (let and const)

A block is anything written inside { }.

Variables declared with let or const are block-scoped.

Example:

{
    let a = 10;
    const b = 20;
    console.log(a);
    console.log(b);
}

console.log(a); // Errorconsole.log(b); // Error

Output inside block:

10
20

Outside the block ? both a and b give error because they are block-scoped.

Why Block Scope Is Important?

It prevents accidental overwriting of variables.
For example:

let x = 100;

{
    let x = 50;   // This is a different variable
    console.log(x);
}

console.log(x);

Output:

50
100

Both x variables are separate because of block scope.

2. Function Scope

Variables declared with var, let, or const inside a function can only be accessed inside that function.

Example:

function show() {
    let name = "Karan";
    console.log(name);
}

show();

console.log(name); // Error

Output:

Karan

Outside the function, the variable does not exist.

Example: Local vs Global inside functions

let x = 10; // global

function test() {
    let x = 5; // local
    console.log("Inside function:", x);
}

test();
console.log("Outside function:", x);

Output:

Inside function: 5
Outside function: 10

Local variable does not affect the global one.

3. Global Scope

A variable declared outside any function or block is in global scope.

It can be accessed from anywhere in the program.

Example:

let city = "Delhi";

function showCity() {
    console.log(city);
}

showCity();
console.log(city);

Output:

Delhi
Delhi

Global variables are useful but should be used carefully to avoid conflicts.

var vs let vs const in Scope

var Is Not Block-Scoped (Important Difference)

Example:

{
    var x = 10;
}

console.log(x);

Output:

10

Although x was declared within {}, it remains accessible outside.
This is why using var is not recommended in modern JavaScript.

Example: let vs var inside a loop

for (var i = 1; i <= 3; i++) { }
console.log(i);

Output:

3

But with let:

for (let i = 1; i <= 3; i++) { }
console.log(i);

Output:

Error

Because let is block-scoped.

Real-Life Example: Scope in Practical Use

let discount = 10; // global variable

function calculate(price) {
    let finalPrice = price - discount; // using global variable
    return finalPrice;
}

console.log(calculate(100));
console.log(calculate(250));

Output:

90
240

The function can access the global variable.

Common Mistakes Beginners Make

1. Using var inside blocks expecting it to be private

2. Re-declaring variables by mistake

3. Confusing local and global values

4. Trying to use a variable before it exists

5. Forgetting that let and const are block scoped

Example Program (All Scope Types Combined)

let a = 50; // global

function demo() {
    let b = 20; // function scope
    console.log("Inside function:", a, b);

    {
        let c = 5; // block scope
        console.log("Inside block:", a, b, c);
    }

    // console.log(c); // Error
}

demo();

console.log("Outside function:", a);

Output:

Inside function: 50 20Inside block: 50 20 5Outside function: 50

Practice Tasks (Do It Yourself)

1. Create a global variable and use it inside a function.

2. Create two variables with the same name inside and outside a block.

3. Try using var inside a block and check visibility.

4. Write a function that uses both local and global variables.

5. Test block scope using let and const.