Question 219200 in Javascript Question posted in
A very good W3school tutorial can be found here.

lexical scoping in javascript not showing error

Can anyone explain me that why dosent this code show error when we have redeclared let x=5 in this code? It should show error due to lexical scoping .

  function demoFunction() {
    let x = 10; 
  
    function demo() {
      let y = 20; 
      let x=5;
      console.log(x); 
      console.log(y); 
    }
    console.log(x); 
    demo();
  }
  
  demoFunction();

Can anyone explain me that why dosent this code show error when we have redeclared let x=5 in this code? It should show error due to lexical scoping .

Tags:

2

Answers


  1. 0

    You can see this is acceptable from the first example in MDN’s documentation for let. Further down you can see this quote:

    let declarations cannot be redeclared by any other declaration in the same scope.

    The key being "same scope".

    From MDN’s definition of scope:

    JavaScript has the following kinds of scopes:

    Global scope: The default scope for all code running in script mode.

    Module scope: The scope for code running in module mode.

    Function scope: The scope created with a function.

    In addition, variables declared with let or const can belong to an additional scope:

    Block scope: The scope created with a pair of curly braces (a block).

    Both declarations of x in your example are in two different function scopes, so this is acceptable. Note that unlike var, let will create an entirely new variable. Note that you can also reference variables that are not in the same scope, but are in an enclosing scope. The chain of enclosing scopes is referred to as a scope chain. When referencing x, the interpreter will take the first x it finds in the scope chain.

    let x = 0;
let y = 0;
let z = 0;
{
  let y = 1;
  let z = 1;
  {
    let z = 2;
    console.log(`x is ${x}`); // 0
    console.log(`y is ${y}`); // 1
    console.log(`z is ${z}`); // 2
  }
  console.log(`x is ${x}`); // 0
  console.log(`y is ${y}`); // 1
  console.log(`z is ${z}`); // 1
}
console.log(`x is ${x}`); // 0
console.log(`y is ${y}`); // 0
console.log(`z is ${z}`); // 0

    In that snippet, there are 6 distinct variables (one x, two ys and three zs). Which variable gets referenced depends on which scope I am doing the referencing. The interpreter will take the closest one in the scope chain.

    Login or Signup to reply.
  2. 0

    You’re not getting any sort of lexical scoping error because variables declared with let and const keywords are block-scoped (In strict mode). Since functions are also block-scoped, variables declared within certain block are accessible within that function. But, every function has its own separate execution context which gets called in a call stack internally one by one.
    These two variables have two different scope and two different execution contexts, that’s why it’s not showing any sort of error.

    function demoFunction() {
    // Variables declared here is accessible within demoFunction scope.
    let x = 10; 
  
    function demo() {
      let y = 20; 
      // This variable here is accessible within demo scope.
      let x=5;
      console.log(x); 
      console.log(y); 
    }
    console.log(x); 
    demo();
  }
  
  demoFunction();
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search