Issue with let keyword

Question

I was playing with some code and ran into a situation where I couldn't identify why 'let' is behaving the way it does.

For the below block of code:

var x = 20; // global scope

function f() {
  let x = x || 30;
}

f(); // VM3426:1 Uncaught ReferenceError: x is not defined(…)

I get the error 'x is not defined' on executing f(). I do understand 'let' variables are not hoisted but since 'x' has a global copy, why isn't the line inside function 'f' defaulting to global copy instead of throwing an error? Does 'let' set the variable to undeclared (instead of 'undefined' with var because of hoisting) at the beginning of the function? Is there any way to get the global copy of 'x' within the function?

Possible duplicate of ["let" keyword vs "var" keyword in Javascript](http://stackoverflow.com/questions/762011/let-keyword-vs-var-keyword-in-javascript) — ozil, Nov 10 '16 at 09:25
The declaration of the local `x` is shadowing the global one, but as you are assigning a value based on an existing `x`, the compliler cannot find one as one is shadowed and other one is not still declared. — Pablo Lozano, Nov 10 '16 at 09:34

m.antkowicz · Accepted Answer · 2016-11-10T09:34:20.990

5

The exception is about the right side x - when you are initializing block-scope x variable the global one is already "forgotten" however the new one is still not being declared and cannot be used during initialization

Compare with explicit calling global one

    function f() {
      let x = window.x || 30;
    }

Also take a look at this MDN article about let dead zones

edited Nov 10 '16 at 09:34

answered Nov 10 '16 at 09:25

m.antkowicz

13,268
18
37

1

so what you're saying is that this part `let x` is evaluated first and the local variable `x` is created but not declared (so that global x is shadowed), and then this part is executed `x || 30` and `x` is not found? – Max Koretskyi Nov 10 '16 at 10:57
Yes exactly - that's what happens – m.antkowicz Nov 10 '16 at 11:15
thanks, I'm wondering how this process `created but not declared` is called – Max Koretskyi Nov 10 '16 at 11:21
I would expect that rather the global name is being erased from a scope - nothing is being created yet – m.antkowicz Nov 10 '16 at 14:03

score 0 · Answer 2 · answered Nov 10 '16 at 09:29

0

let allows you to declare variables that are limited in scope to the block, statement, or expression on which it is used. This is unlike the var keyword, which defines a variable globally, or locally to an entire function regardless of block scope.

Here in your case, an exception is thrown because you are defining let with the same name.

For More Info

answered Nov 10 '16 at 09:29

Gaurav joshi

1,743
1
14
28

That shouldn't be a problem, inside the function it should use the `let` x, outside the `var` – Alexander Derck Nov 10 '16 at 09:32

Mandeep Singh · Answer 3 · 2016-11-10T09:55:39.607

0

The declaration of the local x is shadowing the global one and new one is still not declared first and cannot be used during initialization. It is same situation like following :

 var foo = 5;
    function do_something() {
      console.log(foo); // ReferenceError
      let foo = 2;
    }
  do_something();

For reference MDN

As suggested by @m.antkowicz you can use window.x in your case.

edited Nov 10 '16 at 09:55

answered Nov 10 '16 at 09:43

Mandeep Singh

1,287
14
34

score 0 · Answer 4 · answered Nov 10 '16 at 09:54

you can use this keyword to access global scope

var x= 20; // global scope
 function f() { 
  let x =this.x || 30;    
}
f();

but In strict mode this will default undefined

Read it https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/this

Issue with let keyword

4 Answers4