Welcome back.
In this video we're going to talk about closures.
Closures are one of the more challenging concepts to wrap your head around.
But once you really understand what the definition is and I've seen a couple of them it's going to be
a lot easier.
So what are we going to do in this video.
We're going to understand what a closure is and what it isn't.
We're going to use closures to emulate private variables.
We're going to list some use cases for closures in the real world.
So what's a closure.
A closure is a function that makes use of variables defined in outer functions that have previously
returned.
So I know that definition might not make too much sense right now.
So let's look at an example right away.
I'm going to press command option Jay and open up my chrome dev tools.
Now if we say that a closure is a function that makes use of variables defined in our functions well
then let's make an outer function.
So I'll make a function called outer inside of this function amik a variable called data which is equal
to the string.
Closures are an inside of the outer function.
I will return a new function called Inner and inside of this inner function or make a variable called
inner data and inner data is equal to the string.
Awesome.
Now inside of this inner function I'm going to return the string closures are with the string.
Awesome.
Now let's call this outer function.
And what should it return to us.
Well it's going to return the definition of the inner function.
But notice here that inside of this inner function I'm making use of a variable called data which was
defined in the outer function.
So when I call this outer function and I call the inner function right away it returns the string.
Closures are awesome.
So you may not really see the power of closures right now but this is just a good example of using variables
defined in outer functions like this data variable right here inside of an inner function.
When the outer function has already returned notice right here the outer function is returned but I'm
still able to use this data variable even though the outer function has already returned.
Let's take a look at another example.
Over here I I've a function called Outer that takes in a parameter A and it returns a function called
Inner which takes in a parameter b.
The inner function is making use of the variable A which was defined in the outer function and by the
time that it's called that outer function has returned.
So this function inner is a closure just like the other example that we saw a couple of things to note
here.
We have to return the inner function for this to work and we also have the ability to call the outer
function and then immediately call the inner function or store the result of the inner function in a
variable and call it later which we commonly do.
Let's try a quick exercise.
See if you can figure out if either of these functions contain a closure puzzle video for a second.
All right what did you come up with in this first function.
We can see that the inner function is not making use of any variables to find in an outer function that
has returned.
So this one right here does not contain a closure in the second example.
We can see that the inner function is making use of a variable called data which was defined in an outer
function that has returned by the time the inner function will be called.
So the first one is not but the second one is always go back to the definition of a closure.
And if you see that the inner function is not making use of variables in an outer function it's probably
not a closure.
So when would you use a closure.
Well a great use case for closures is to create the idea of a private variable in other languages.
There exists support for variables that can't be modified externally which we call private variables
but in javascript we don't have that built in.
Thankfully closures can help us out with that.
So let's take a look at this example in the chrome dev tools in a press command option Jagan and open
that up and I'm going to write a function called counter and inside of this counter function.
I'm going to make a variable called count so that equal to zero and inside of this counter function
I'm going to return a new function.
No notice right here that I am not giving this function a name.
That is because these functions are anonymous.
So if I want to name this function I can call this something like counting but I don't need to.
And inside of this inner function I'm going to return plus plus count.
And the reason that I'm doing plus plus here as a prefix operator is so that the first time that I call
it it goes up to 1.
Now I can set this counter function to be equal to a variable called C and I'll save R C is equal to
counter.
Now what do you think C is going to be when I take a look at it.
Well just like we saw before.
It's going to be a function definition and if I call C again I'm going to return the count incremented
by 1.
Let's call it again and again.
But what's really nice about this is that no one has access to the variable count in the scope that
I'm in right now.
If I try to access count I'm going to get a reference are saying count is not defined.
And since count is a private variable no one can come in and change with the value of count starts off
at it's always going to be zero.
Pause the video and try to copy this example in the chrome console.
It will help out a lot with understanding how closures work.
Let's take a look at another example of private variables inside of this classroom function.
I have a variable called instructors which is an array of two strings called an LP.
This classroom function returns an object with two functions.
Get instructors and an instructor get instructors allows me to just display disarrayed at instructor
is a function that takes in a parameter and adds it to the instructor's array.
So where is there closure going on here.
Well notice that the GET instructors an add instructor function.
Both make use of this instructor's variable which is outside of this function here and this function
here.
So these two functions get instructors and add instructor are using variables defined in outer functions
that have already returned.
You can see right here they get instructors allows me to print out the array of Ellen colt and instructor
allows me to add an instructor to that array and returns theory.
But when I create a new classroom with another variable and I get the instructors we can see that Ian
is not here.
Finally through using closure we've made the instructors variable over here a private variable.
No one can modify it so anytime that a classroom is created the instructors that you get are always
going to be called an alley.
So it looks like you're stuck with us for a little while so even though we have a small example here
a lot of tools and technologies that you'll be learning about make use of closures quite a bit.
So when you're looking at some of that code try your best to see if you can spot where those closures
are.
Well be sure to point out to you as well.
So what do we learn.
A closure exists when an inner function makes use of variables declared in outer function which has
already returned and closure does not exist.
If you do not return an inner function and if that inner function does not make use of variables returned
by an outer function we also saw that we can use closures to create private variables and write better
code to isolate our logic and our application.
And that's it for closures.
See you in the next video