let & Scope

[00:00:00]
>> We had a question. Is there some way to force the variable I'm dealing with in my local scope of my function, to exist outside of it in the wider scope, in the global scope. All right, that was the question am I paraphrasing, okay. So let is one kind of hack we could use to do something like this.

[00:00:25]
But this can be kind of dangerous. So for example, let's say we have a variable called feeling that has a value of free. Because it's a let variable, that means I can change what it points to. So if I have a function trap within that scope. I can do an assignment to the variable feeling, which was created in the outdoors global scope, and assign it to a new value boxed in.

[00:01:01]
So now the question is outside of that function, once I've run the function trap, what is going to happen when I do console.log(feeling). What do you guess.
>> Boxed in.
>> Boxed in. Any other guesses? Let's find out. Oops, all right, so we have our feeling free, just checking free, cool.

[00:01:26]
We have our trap function. Nothing happened. Didn't call it yet. Let's call it, okay. And now let's check what feeling is, it is indeed boxed in. Okay, let's go to the whiteboard and talk about what just happened. So we had our global scope We declared a variable feeling and what did this point to initially?

[00:01:59]
>> [INAUDIBLE]
>> The string free, okay. And because it's let, we have a flexible arrow here that can be changed. Then we had our function, what was it called, trap? Which creates its own new scope with tinted windows on it. But in this case, within there, we had a reference to the variable feeling.

[00:02:27]
We asked JavaScript, give me the variable feeling. Because of the tinted windows JavaScript says okay, I don't see any local variable feeling. So let me look out the windows. I find this variable feeling. Now I've got it. And then we said, we gave an assignment to a new value.

[00:02:47]
And when it runs that assignment, JavaScript is gonna conjure up the whatever it was called, boxed in the new value. And it's going to get rid of our old association. Because feeling it found in the global context and it can actually modify what feeling points to, even though it's outside of its scope.

[00:03:14]
So that change, the pointer change from free to boxed in, is actually going to persist outside of this function scope. So this is kind of a weird thing that we need to be careful of when we're using variables with let. Which means that we can reassign them. Now, if we had tried this with const, what would've happened?

[00:03:41]
Error can't reassign, can't reassign const. So wouldn't matter whether we were inside or outside of the function. We can't reassign a const variable. Another reason why it's often useful to use const. So that accidentally somebody doesn't mess with your variables while you're not looking. Okay, any questions on that?

[00:04:02]
>> But isn't string immutable in JavaScript?
>> Great question. So, yes, strings are immutable. Notice that we did not change the free string. What changed was the pointer, the arrow connecting The variable feeling to a value, the arrow that JavaScript will then follow anytime we ask it to evaluate the variable feeling.

[00:04:33]
So initially it was pointing out one string. We didn't change that string, we conjured up a new string. Got rid of that old arrow and then created a new arrow pointing to a different value. So we did not actually modify the string free. We modified what the variable points to.

[00:04:56]
And that was only possible because it was a let variable, and not a const. Good stuff, all right. So this is scope. There is a lot more that can be said about scope and JavaScript. There is a lot more. And as you dig deeper and deeper, and deeper into JavaScript, you're going to run up against other scope weirdnesses.

[00:05:15]
So I highly encourage you all to continue exploring that and doing some research. You can read about it on places like MDN, you can read about it on, people blog about it. There's lots of other good resources about scope in JavaScript, there are some other great courses in FrontEnd Masters.

[00:05:32]
Does that go more in depth into how scope works. But this is just kind of a basic first step with JavaScript scope, is to kind of. Think about it like every time we create a function, we're creating a new limo with tinted windows on it, that we can't look into.

[00:05:51]
And that is going to affect which variables we can reference, where and when. But we can see out of the limo. So that's why we were able to modify our feeling that was declared outside of this trap function. And it's also how we were able to, in our isCorrect function.

[00:06:12]
We were able to evaluate fact, which was a variable declared in the wider context, not inside of the function.