❮ Previous

JavaScript Variable Scope

  • This lesson explains different types of variable scope in JavaScript.

  • What is Variable Scope ?

    Variable scope defines where a variable can be accessed or used in a JavaScript program.

    In simple terms:

    Scope answers the question:
    “From where can I use this variable ?”

    If you try to use a variable outside its scope, JavaScript will throw an error.

    Why is Scope Important ? 

    Understanding scope helps to:

    • Avoid variable name conflicts

    • Write clean and maintainable code

    • Prevent unexpected bugs

    • Control data access

    • Improve code readability

    Types of Scope in JavaScript

    JavaScript mainly has the following scopes:

    1. Global Scope

    2. Local Scope (Function Scope)

    3. Block Scope

    Global Scope vs Local Scope

    Global Scope

    A variable declared outside all functions and blocks is in the global scope.

    Characteristics of Global Scope

    • Accessible from anywhere in the program

    • Can be used inside functions and blocks

    • Exists as long as the program runs

Global Scope in JavaScript

Variables declared outside functions are accessible everywhere. 

// Global variable

let message = "Hello World";

function greet() {
  console.log(message); // accessible inside function
}

greet();

console.log(message); // accessible outside function

  • Explanation:

    • message is declared outside the function

    • It can be accessed inside greet()

    • It can also be accessed outside the function

      Problems with Global Scope

      Using too many global variables can:

      • Cause naming conflicts

      • Make debugging difficult

      • Accidentally overwrite data

      • Reduce code safety

      Local Scope (Function Scope)

      A variable declared inside a function has local scope.

      Characteristics of Local Scope

      • Accessible only inside the function

      • Cannot be accessed outside the function

      • Created when the function runs

      • Destroyed after function execution

    Local Scope

    Variables inside a function are only accessible within that function. 

    // Local scope (function scope)

function showMessage() {
  let text = "Inside Function";
  console.log(text); // accessible inside function
}

showMessage();

console.log(text); // Error (not accessible outside)

    • Explanation:

      • text is declared inside the function

      • It works inside the function

      • It is not accessible outside

        Global vs Local Scope Comparison

        FeatureGlobal ScopeLocal Scope
        DeclaredOutside functionsInside functions
        AccessibleAnywhereOnly inside function
        LifetimeEntire programDuring function execution
        RiskHighLow

        Real-Life Example

        Global Scope:

        • Public notice board (everyone can read)

        Local Scope:

        • Personal notebook (only owner can read)

      • Block Scope

        What is Block Scope ?

        Block scope means:

        Variables declared inside { } are accessible only within that block.

        Block scope applies to:

        • if

        • for

        • while

        • { } blocks

        Block scope works with let and const, not with var.

      Block Scope with let and const

      Variables declared with let are limited to their block. 

      // Block scope using let

if (true) {
  let x = 10;
  console.log(x); // accessible inside block
}

console.log(x); // Error (not accessible outside block)

      • Explanation:

        • x is declared inside the if block

        • Accessible inside the block

        • Not accessible outside

      Block Scope with const

      Demonstrates that const variables are accessible only within their block. 

      // Block scope using const

{
  const pi = 3.14;
  console.log(pi); // accessible inside block
}

console.log(pi); // Error (not accessible outside block)

      • var Does NOT Have Block Scope

        Variables declared using var ignore block scope.

      var Scope Issue

      Shows that var variables are accessible outside block. 

      // var ignores block scope

if (true) {
  var a = 5;
}

console.log(a); // accessible outside block

      • Explanation:

        • var is not block-scoped

        • It leaks outside the block

        • This can cause bugs

      Block Scope in Loops

      Shows that let variables in loops are not accessible outside the loop. 

      // let is block-scoped in loops

for (let i = 0; i < 3; i++) {
  console.log(i); // runs inside loop
}

console.log(i); // Error (not accessible outside loop)
      • Using let keeps i limited to the loop.

      var in Loop Scope

      var allows the loop variable to be used even after the loop ends. 

      // let is block-scoped in loops

for (let i = 0; i < 3; i++) {
  console.log(i); // runs inside loop
}

console.log(i); // Error (not accessible outside loop)

      • This behavior is unsafe in large programs.

        Scope Summary Table

        KeywordGlobal ScopeFunction ScopeBlock Scope
        varYesYesNo
        letYesYesYes
        constYesYesYes

      • Common Mistakes

        • Using var instead of let

        • Accessing local variables globally

        • Forgetting block boundaries

        • Overusing global variables

      ❮ Previous