This course has been updated! We now recommend you take the JavaScript: From First Steps to Professional course.
Transcript from the "Closure Introduction" Lesson
[00:00:04]
>> Bianca Gandolfo: Anyone think about any questions, some scope questions during the break?
>> Bianca Gandolfo: Yeah.
>> Speaker 2: So when you have nested scopes is that the same thing as, I looked it up a little bit, is that the same thing as lexcal scope? When you have nested scopes?
>> Bianca Gandolfo: So, lexical scope basically means that if you look at it, the scope is defined by how it looks.
[00:00:32] So if the nested scope is inside of it, that's yes, so I guess you could think of it that way like nested scope is an example of lexical scope, yeah. So, if you have the function, a sibling and even though you're calling it from inside, that scope doesn't work because of something called lexical scope.
[00:00:53] And the way I think about it is that if you see the function actually inside, then it has access. It's not like an academic definition, but that's just like my working understanding of how that is. Cool, and Joe you said you had a question?
>> Joe: You answered it.
[00:01:10]
>> Bianca Gandolfo: You answered it, awesome, cool. Anyone else have any questions? All right, so we're gonna talk about closure. So closure is the next step with scope. A closure happens when you return a function from inside the function and that inner function retains access to the scope. We saw that a little bit in our exercises here at the very bottom.
[00:01:39] So even though we made this inner function global, it still had access. And it remembered, quote unquote, that we had incremented our counterInnerScope to 12, and so-
>> Joe: Why?
>> Bianca Gandolfo: Why, we're going to get there, we're going to get there. We'll walk through it. And so, that is an example of closure.
[00:02:09]
>> Joe: Isn't that a violation of scope thing?
>> Bianca Gandolfo: It's a violation of scope. No, I think it's taking advantage of the power of scope to do some interesting things.
>> Joe: But didn't we say that the variable inside the function is not available to something that's outside the function.
[00:02:29]
>> Bianca Gandolfo: But if you return a function from inside the function, that function was originally inside the function. But we'll get there, we'll walk through it. We'll walk through it step by step and talk about what I mean when I say closure. So our first thing I want us to look at is this function called closureAlert.
[00:02:52] And it says it's a function that has a variable that's initialized that says, "Help! I'm a variable stuck in a closure!" and then we have this inner function called alerter, and all it does is alert(x). And then we call alerter from inside. So let's play with this in our console.
[00:03:15]
>> Bianca Gandolfo: Can everyone see that, even in the back? Cool, thanks. So now so we have closure alert so if I just type out closure alert what's gonna happen?
>> Bianca Gandolfo: How about Ben? What's gonna happen if I just type out closureAlert like that?
>> Speaker 4: It's gonna return the definition of the function.
[00:03:44]
>> Bianca Gandolfo: Absolutely, so it's just gonna return the definition of the function. And then if we wanna call the function, we'd put the two parenthesis, right? So we call it, once we call it, it's gonna go into this function body, right? It's gonna declare this variable, it's gonna say great there's a function.
[00:04:03] Then it's gonna call alerter and then that point it goes inside alerter's function body and alerts x.
>> Bianca Gandolfo: And then we have this alert. Can someone read that.
>> Joe: Help I'm a variable stuck in an enclosure.
>> Bianca Gandolfo: Thank you. Awesome, so that seems comfortable. We've done that before, right, in previous exercises.
[00:04:30] We're just calling a function from inside of a function. It's not a surprise to us that this x refers to the x in the parent function cuz we know that their child function retains access to that parent. Cool, any questions on that, thumbs?
>> Bianca Gandolfo: Cool, did you have a question with the side thumb?
[00:04:57]
>> Speaker 5: Not quite there.
>> Bianca Gandolfo: Okay.
>> Speaker 6: I didn't see where you called the closure alert so that never gets called at all then?
>> Bianca Gandolfo: Well I just called it in the console. But for example, you could just do like this.
>> Speaker 2: Yeah.