Facade
A Facade as it's name imply's provides a simplified interface to a larger body of code, such as a class library or larger object. Facades are very handy when you want to minimize an API to protect some of the methods (or hide them from the end user/developer).
Video Transcript
00:00The facade design pattern, as its name implies,
00:03suggests that it's going to be a facade.
00:06What does that actually mean in programming?
00:09The idea is to simplify an interface
00:12to reduce an API footprint.
00:14So if a class, if an object has four methods,
00:18maybe we just want to expose three out of them
00:20to the consumer.
00:22It's a great way to remove API elements
00:25that you need or want to protect,
00:26which we'll see in this lecture.
00:28And it helps control application features and access,
00:31which is also a really powerful feature.
00:34In this lecture, we're going to go back
00:36into one of our objects and protect one of its features,
00:39and we'll explain why in the lecture.
00:42So let's jump right into it.
00:45So a very realistic scenario.
00:47In this scenario, we're happy with our objects
00:50that we're sending in our application,
00:52but we really don't want anyone to have access
00:55to this scatter.
00:56We don't want them to have access
00:57directly to that jQuery item,
00:59for one, because we might not work
01:01with jQuery in the future.
01:02And we don't want users to use it
01:04because then if they do,
01:05and we make an update to our application,
01:07we'll break their application.
01:09So our goal is to figure out a way
01:11to hide this exposure to whoever
01:13doesn't need access to it.
01:15In our case, the only one that really needs
01:17access to it is our Singleton.
01:19And that Singleton is internal to our application,
01:21so that's fine.
01:22But when we go down to the core,
01:25when we're adding the circle,
01:26exposing it out here,
01:28when the user is pressing out
01:29and they're gaining access to new objects,
01:32we don't want them to have access to the gather.
01:34To solve that, we're gonna create a shape facade.
01:37And facades are very similar
01:39to a lot of the design patterns
01:40that we met previously.
01:42And really, the only difference is
01:43that a facade, its main intention,
01:45is to hide away interfaces
01:47and simplify interfaces.
01:49Very similar.
01:50But let's go ahead and create it.
01:52And all these solutions,
01:54you don't have to memorize their names
01:57to be familiar with these type of solutions,
01:59so then you can make very good decisions
02:02when it comes down to
02:03how do you solve different problems.
02:05So what I'm doing here,
02:06I'm creating a helper function,
02:07just like our decorator.
02:09And what I wanna do is
02:10I wanna basically return back
02:12a simplified object that will store
02:14all the things we want the user
02:15to have access to.
02:17In this case, what do we want them
02:18to have access to?
02:19Let's take a peek.
02:20In our case scenario,
02:21we decided that we want users
02:23to be able to access the color,
02:24the move, and that's it.
02:27So to do that,
02:28I'm gonna go ahead here
02:28and just set the color.
02:31Define that internally as a function.
02:33The reason why I'm configuring a function here
02:35is really important
02:36is because I don't wanna lose scope.
02:38And if I just call the shape.color
02:41and configure it to that color,
02:43I'm gonna lose scope of the shape
02:45and it won't work.
02:46So instead of that,
02:47I'm basically creating a mirror
02:48that is pushing down
02:49whatever that definition of the function is
02:51downwards to that shape
02:53whenever this function is called.
02:55Let's go ahead and create the next one
02:56which was move.
02:57And again, it's a function.
02:59It has two coordinates.
03:01And when it's called,
03:02we're gonna go ahead and call that shape
03:04and we're gonna move it
03:05and we're gonna move it
03:06in its x and y coordinates.
03:08And that's all we really need to do
03:10in this stage.
03:11All right, so now that we've done that,
03:12I'm gonna go ahead and save this
03:14and I'm gonna save this
03:15and I'm gonna copy the shape facade.
03:16And I wanna go back into my main application,
03:20which is gonna happen somewhere down the line here
03:22inside of my singleton
03:23in the process of the creation.
03:25And what I wanna do is I wanna wrap my circle around
03:28in a shape facade.
03:30By wrapping my circle around
03:31inside of a shape facade,
03:33I'm basically hiding away the exposed API,
03:36limiting it to a much smaller API.
03:38Now the application is not gonna work immediately
03:41and that's because once we do this,
03:43then when the user is gonna be trying
03:45to add items into the stage itself,
03:47it's not gonna have access
03:49to that circle anymore.
03:50We'll solve that in the next lecture,
03:53but I wanna show you that it's not gonna work anymore
03:54and that's fine
03:55because in the next lecture,
03:57ooh, why are we still working here?
03:59Did I save it?
04:00Go ahead here, click on save
04:02and click on refresh
04:04and here we go, beautiful.
04:06And it's not working the way we thought it wouldn't.
04:08And we could see that circle.get is not a function
04:10and that is true
04:11because now our API is more limited,
04:14but this limited API is not really good for us
04:17once we're back inside of our singleton.
04:18So we're gonna have to find a solution for that.
04:21So before we wrap up this video,
04:22I just wanted to go over that shape facade again.
04:25The idea is really simple.
04:27We send inside an object that has a bigger API
04:30and we're reducing its API to reduce the exposure
04:33to give us more control over it.
04:36In the next lecture,
04:37what we're gonna do is we're gonna have to revisit
04:39this item, our circle,
04:41to be able to give it an ID
04:43so we could then refer back to that original circle
04:45because right now it's nameless
04:47and without a name,
04:48it's gonna be very hard for us
04:49to figure out how to link them back together
04:51once we're returned back into the singleton.
04:54In this lecture, we met the facade design pattern,
04:57but we ended this lecture with a problem.
05:00Our application isn't working.
05:01So it's time for us to go back and actually fix it
05:04and we're gonna get that application working again
05:07in the next lecture.
