Why the `i` is not defined In Javascript ES6?

Question

for (let i = 0; i < 2; i ++){
    console.log('inner',i);
}
console.log('**************');
i =-1;
if( i < 2) {
    console.log('inner',i);
    i =  i +1;
    if( i < 2){
        console.log('inner',i);
        i =  i +1;
        if( i < 2){
            console.log('inner',i);
            i =  i +1;
        } else {
            return ;
        }
    } else {
        return ;
    }
}

The code above is correct.

This is the result .

inner 0
inner 1
**************
inner -1
inner 0
inner 1

When I wrote the following code , this error occurs .
The for

The error

console.log('inner',i);
^ ReferenceError: i is not defined

for (let i = 0; i < 2; i ++){

    console.log('inner',i); // i is not defined
    let i = 100;
}
console.log('**************');
i =-1;
if( i < 2) {
    console.log('inner',i); // i is not defined
    let i = 100;
    i =  i +1;
    if( i < 2){
        console.log('inner',i);
        i =  i +1;
        if( i < 2){
            console.log('inner',i);
            i =  i +1;
        } else {
            return ;
        }
    } else {
        return ;
    }
}

`let` has a block scope so i guess that declaration comes after log so that is undifined. — Jai, Jul 21 '16 at 13:04
Whenever talking about Javascript and the ECMA standards it is important to note the implementation. What are you using to run the javascript? (is it web based? can we expect Chrome with V8? are we using Rhino?) — Brennen Sprimont, Jul 21 '16 at 13:06
This might help: http://stackoverflow.com/questions/762011/let-keyword-vs-var-keyword — Rajesh, Jul 21 '16 at 13:06
@Jai: Actually, [unitialised not undefined](http://stackoverflow.com/a/31222689/1048572) — Bergi, Jul 21 '16 at 13:11
@Jai what i meant was that it doesn't log at all, it throws. — Bergi, Jul 21 '16 at 13:15
@Bergi **throws** accepted. BTW the answer you posted is awesome. — Jai, Jul 21 '16 at 13:18

Theodore Norvell · Accepted Answer · 2016-07-21T15:24:02.897

The standard says, "let and const declarations define variables that are scoped to the running execution context’s LexicalEnvironment. The variables are created when their containing Lexical Environment is instantiated but may not be accessed in any way until the variable’s LexicalBinding is evaluated."

When the block

{                             // 0
    console.log('inner',i);   // 1
    let i = 100;              // 2
}

is executed:

Line 0: the lexical environment is instantiated, meaning that the variable i is created at that point.
Line 1: The use of i here refers to the variable named i in the newly instantiated lexical environment. However since the lexical binding on line 2 hasn't yet been executed, it is an error to access this variable.

My earlier answer was completely wrong. I've edited it to be correct. — Theodore Norvell, Jul 21 '16 at 15:24

Tropic · Answer 2 · 2016-07-21T13:27:05.353

As @Jai mentioned, the let keyword is only defined inside of the block scope it was created in. So let's look at your code:

for (let i = 0; i < 2; i ++){ // i is declared using let so it can only be used inside of this for loop

    console.log('inner',i);
    let i = 100; // Here you're re-declaring i for some reason? This could be the cause of i being undefined on the above line
}
console.log('**************');
i =-1; // Here you're trying to access i outside the for loop, but since it's outside it's not defined
if( i < 2) {
    console.log('inner',i); // i is not defined, same reason as previously
    let i = 100; // However here you declare i again, so the next console.log will not cause an error
    i =  i +1; 
    if( i < 2){
        console.log('inner',i);
        i =  i +1;
        if( i < 2){
            console.log('inner',i);
            i =  i +1;
        } else {
            return ;
        }
    } else {
        return ;
    }
}

Since it looks like you want to use i in the whole file, you could just declare it globally instead:

var i = 0;
for ( ; i < 2; i ++){

    console.log('inner',i);
    i = 100;
}
console.log('**************');
i =-1;
if( i < 2) {
    console.log('inner',i);
    i = 100;
    i =  i +1; 
    if( i < 2){
        console.log('inner',i);
        i =  i +1;
        if( i < 2){
            console.log('inner',i);
            i =  i +1;
        } else {
            return ;
        }
    } else {
        return ;
    }
}

score 0 · Answer 3 · edited Jun 20 '20 at 09:12

1/ you can't use return outside of function.
2/ let defines a variable in a local scope. You can't access i out of the for loop.
3/ your code returns

inner

inner 100 (You defined let i = 100, used the second iteration in the for, see 4/)

**************

inner

Tested on http://babeljs.io

4/ As MDN says, Defining a let variable after its use throw ReferenceError. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let#Temporal_dead_zone_and_errors_with_let

The solution :

for (let i = 0; i < 2; i ++){
    console.log('inner',i);
}
console.log('**************');
var i = -1; // Defines i with var instead of nothing, causing i = undefined
if(i < 2) {
    console.log('inner',i);
    i++; // Incrementation shortcut
    if(i < 2){
        console.log('inner',i);
        i++;
        if(i < 2){
            console.log('inner',i);
            i++;
        }
    }
}

Why the `i` is not defined In Javascript ES6?

The error

3 Answers3