JavaScript Tutorial Part 1 - Lexical Environment

JavaScript Tutorial For Beginners

Learn about Lexical Environment in this JavaScript tutorial. A pretty good starting point into the language. JavaScript lexical scope, JavaScript lexical scope example, JavaScript lexical scope definition.

Other potentially relevant keywords:
let, var, scope, hoist, hoisting, execution context, call stack.

Self-education
Computer Literacy
For next generation of teachers
artists, coders, designers, and makers of things.

[artihlec]

It's a good brush up on fundamentals.

[imtinankhurshid]

awesome video man i wish you had a million followers .

[LalitTaparia]

Never found javascript Concept so easy earlier! Thanks

[doram]

Excellent. If i need to vote for a best teacher then you would be the first one . Hope to see more videos from you.

[mohamedelheni]

You make a good work, and i want to add something to this explanation
we expected the code to print the numbers 0, 1, 2, but it outputs the number 3 three times . The reason is that variable i is shared across each iteration of the loop, meaning the functions created inside the loop all hold a reference to the same variable. The variable i has a value of 3 when the loop completes, so when console.log(i) is called, that value prints each time.
To fix this problem, we can use immediately invoked function expressions:
for(var i =0; i<3; i++)
{

setTimeout((function(value) {
return function() {
console.log(value);
}
}(i)), 1000);
} // output: 0 1 2
The i variable is passed to the IIFE, which creates its own copy and stores it as value. This is the value used by the function for that iteration, so calling each function returns the expected value as the loop counts up from 0 to 2. Fortunately and as you say block-level binding with let and const in ECMAScript 6 can simplify this loop, because The let declaration creates a new variable i each time through the loop, so each function created inside the loop gets its own copy of i. Each copy of i has the value it was assigned at the beginning of the loop iteration in which it was created

[danielmaritim]

Indepth tutorial. Looking forward to more. Thanks. I was looking forward to an explanation of const and let and i finally understood. Thanks

[cynthiaclinton]

Thank you for further clarifying the difference between the var and let keywords! Looking forward to more in-depth tutorials!

[sergiomartin]

You did a great work. Thank you !
The different behavior of "let" in lexical context
is an incredible breakthrough that all Javascript-Coders
were looking forward to since the beginning of times.... and still cannot use it
because of the widespread use of IE on enterprises !

Keep up the good job!

[milehighgarage]

Great presentation & diagrams / flow charts of complex JavaScript subject matter in bite size chunks. Look forward to the rest of your series and book. Well done.

[aaronksphoto]

Great video! Enjoyed learning about lexical scope

[nicholasmaniccia]

This is an awesomely original tutorial, I just got done doing a deep dive on JS lexical and executional environments, including the "this" keyword, this definitely helped me feel confident with that new knowledge. I am interested in what other less discussed/popular topics you are going to make into tutorials. Do you get this knowledge through pure application and experience or do you have a preferred source to teach yourself these topics?

[terrymarr]

I'm a bit confused. You say at 6:17 that "a lexical environment for a function is not created until it is executed". But the function is hoisted so it can be called before it is declared in the code. Can you explain further what you mean by that?

[MrKaremnour]

finally i found good tutorial for lexical environment, good work

[drapala]

1) block scope é um tipo de lexical environment
2) global scope é definido pelo script tag no documento html
3) outro tipo de lexical environment é o escopo gerado por funções, entretanto esse escopo é criado somente quando a função é invocada *e não quando ela é definida* ou seja, apesar da função conter os {} aquilo não gera escopo até o instante em que a function declaration é invocada através dos ();
4) for loop também gera lexical environment

[ber-junelastimado]

Correct me if I'm, but I think let and const are hoisted at the top of the block but in the temporal dead zone.

[kraftycoder]

Really love your passion on this ♥... Great Twitter fan

[AnkitKumarOjha]

Can someone explain how let worked with setTimeout and not var?