var, let & const Scope

[00:00:00]
>> Maximiliano Firtman: To finish the ESX recap, we will go to that URL Firtman my last name, .github.io/projs. And there we will be playing with different ECMAScript features directly in an online editor. For modules, we have separate files, and it was better to use BS code and a folder, opening that URL.

[00:00:30]
This is how it looks like, can go full screen as well. So we have a selector here at the top, let me clear this so it's empty as your example. So it's just a vanilla JavaScript code editor, okay? So I can write some code here, like console.log("hello"), run.

[00:00:54]
You can run also with Cmd+Return on the Mac, Ctrl+Enter on Windows or click Run. And the console log will show there, just we can quickly analyze some chart scrape and the differences and so on, so that's the goal. And then we have here selected to load a codelab.

[00:01:16]
So we have several chapters here, and we will go through most of these options we have here, some of them are small things and really simple. Some others may need some work, and they have a challenge and then that's why there is a solution that will give you a solution and so on.

[00:01:37]
So for example, if we go to a scope variables, if you run this nothing important really happens yet, I will just use this to just do a very quick recap on variable declaration and scoping. And by the way here also you have a link to download the slides, okay?

[00:01:56]
For this workshop, so there. So in case you wanna download a copy of the slides, it's there. So by the way, the whole editor is using open source editor. So something simple, vanilla JavaScript, nothing really fancy here is going on. So every variable that you define in a context outside of modules, at least it's global, probably you know that.

[00:02:22]
So if you use the bar keyword, it's global. And if you use the bar keyword inside the function, it's function scope. So for example, this was something that was making crazy a lot of developers coming from Java, C, C-sharp into JavaScript. Script that you declare a variable within an if.

[00:02:43]
So it's inside this code block that declaration, but that variable is actually function scoped, not block scoped. So actually, it's available here. That's why when you run this, it says, Check me and people coming from Java, C-sharp, C, they were used to block scoped variables. So every time you have a block like a code block calibrates, and you create the variable there, it should work only within that block.

[00:03:12]
Well, that's not what happens by default with JavaScript and the bar keyword. But when you change that to the led keyword, the led keyword is block-based, and this is more similar to other languages. And again, why did you just change the behavior of bar, back bar compatibility, okay?

[00:03:34]
So now when you run this, it says function scoped is not defined. Because, yeah, it's defined within this code block only, okay? It's something simple and const, it's actually similar with the difference that makes that variable immutable. We can discuss the whole day if const creates constants or immutable variables, we are not going to discuss that anyway.

[00:04:02]
But yeah, it says const, but it's actually a variable because it's using space in memory compared with how constants work in other languages, but it's immutable. But we know for sure that it's immutable, okay? So it's not gonna change once I set it.