Next is Controlling the global access completely
As promised, we now turn our attention to the global scope. Our goal in this lesson is to remove access all together to the global scope and define and control completely how and who had access to our objects.
Video Transcript
00:00It's time for us to complete the concepts that we started with by controlling the global access completely
00:05We're gonna do that by using the module concept that we've met throughout the section making every single thing private
00:13Once we made everything private
00:15We're gonna conditionally add elements into the global scope only by what we want to add into it
00:21We're gonna wrap up this lecture by also talking about how do we send global elements inside of this overarching
00:26Arching mega mojo module that we're creating. So let's jump right into it
00:33As promised there's one more thing we need to confront and that is that we're still working with the global scope
00:38And I told you not to worry too much about namespaces right now because i'm going to show you a way to avoid
00:43The global scope all together and the way to do it is so simple because it connects to what we were doing so far
00:50We were using an anonymous function that was self-assigned self-running
00:55All this time along and we could just very easily go ahead and create that self-assigned function and literally
01:02And i'm just going to go ahead here and create it quickly and literally just assign every single thing we've done
01:07So basically taking everything in our code including our jquery
01:12Run and have it all run within the scope of that function
01:16And all i'm gonna do is i'm gonna wrap around it with a round bracket like we've done previously and then execute that function
01:22So i'm going to go ahead here and now execute the function as well
01:26Now what i've done here is I basically got us out of the global scope altogether and that means nothing is accessible outside
01:33And because we are self-run and we don't need
01:36Access to the global scope or really we don't need the global scope to have access to our elements
01:41Then we just made everything completely private even though internal we have public apis
01:46Enabling us to have much more than just one variable
01:48But we could have clusters of these variables to run at the same time
01:52Now if you prefer working in an object oriented way, that's fine
01:56And you could wrap up your object oriented programming all into an opening closing bracket type of function a self-enclosed function
02:04Making it all private so you could mix and match between those two concepts
02:07And again, this really connects to the idea that design patterns are not solutions, but they're suggestions
02:14So you could use and mix and match design patterns based on your need and
02:18Rely on them based on whatever you need in there
02:20So i'm going to go ahead and save this and click on refresh and if I go ahead and do that
02:24We'll see that our application is still working just as it did before just with that small change
02:30With that said I want to talk about one more thing right now our function
02:33Our self-enclosed function is actually using the global scope. It is using the document and it's also using the actual
02:42Jquery, so what I could do is I could literally go ahead and I could say hey
02:46I want to send your i'm going to send the window and i'm going to send the document
02:51And i'm also going to send jquery
02:53Literally sending all the three elements that we're going to be working with sending them directly into the object
02:59By doing that i'm going to go ahead into that function definition
03:02And i'm just going to make sure that I also have their names there decide defined. So if I want I could
03:09alias them into maybe win
03:11And doc and I could alias our jquery to the very common
03:16alias of dollar
03:17So the dollar doesn't need to change but any place that i'm using the document I could go ahead down here and just set this
03:22To be doc
03:23Now why did I also import the window itself?
03:26What I could do also is create a public api inside of the window
03:30And what I could do there is basically set there an if condition just before we're wrapping everything up
03:35And I could ask if in my window dot whatever property I want it to be so for example, I want this to be chat module
03:43If window dot chat model doesn't exist
03:46Right, if it does not exist i'm going to go ahead and i'm going to set that value to be window dot chat module
03:53And I could then define it now the idea here is very very simple where i'm just going to take that module and just
03:59Define that chat module right inside there in the bottom there next to our window
04:03Now i'm just going to go ahead and save this for a second
04:06And once i've created this process then at at the point where our application is going to run then
04:12Globally accessible I could then define what is globally accessible and literally I could do your a small little console
04:18call
04:22And I could get access to the window
04:24dot
04:25Chat module now obviously you could make this much smarter than that because you could then define based on if it's an update
04:31And create whatever logic you want to control the access to the global scope not automatically
04:37But define it based on basically whatever results come up with your conditions towards the end of your creation process inside of your application
04:44You could create a public api that would give access to all the different modules that you have
04:49So let's just give it a refresh and see that everything is still working
04:52And we could see also we have access to the model as module as well through the global scope
04:58And the big advantage here is that we didn't automatically override the global scope
05:02So we we could test out and see if it's available
05:05And if it's not available, we could throw an error saying hey
05:07We need this to be available for our application to work
05:10Or we could define some sort of mechanism to enable the user to change the name of
05:16The area in the global scope that is being sent in this case when i'm sending the window and the windows really main goal
05:21Is to be able to add variables. It didn't have to be the window. We could have sent inside something completely different in line 57 here
05:28In this lecture, we really wrapped up the topic of privacy and with it the core
05:33Modules and the core design patterns that are used in javascript
05:37We're ready now to move to the next section because in the next section we're going to go back to those
05:42group of four
05:43And the split that they had of the different types of design patterns as we approach the creational design patterns
05:50So we'll see in the next section when we explore the different creational design patterns