In the last video we got a good solution to our ad marker issue.
Now I repeated the same thing and there like five or six times.
Remember the whole idea here is that we defined instructions on how you can be malleable.
So as long as another class has a location with allowed to longitude their numbers it can be an argument
to add marker.
So take a look at the impact on custom map now inside a custom map.
We no longer have any direct references to user or company so that means that these two import statements
at the top of the file can be deleted.
So we now have a stand alone custom map class that we could very easily reuse on future projects as
well.
In fact if you ever want to show a Google map in the future save this file like really save this file
because as long as you have any other object on any other project you work on that satisfies this interface.
This class is going to work for you.
You can use this exact class right here to show a Google map and then show different markers on it.
All right.
The last thing I want to do inside this file I'm gonna delete that ad company marker method down here.
We don't need this anymore looks good.
Now last thing I'm going to do is flip back over to index dot T.S. and we need to fix up the references
to the methods that we deleted.
So add a user marker no longer exists.
It's now going to be ad marker and same thing for ad company marker as well.
That's also going to be ad marker so notice how typescript has no complaints about these two lines of
code.
Remember here's what's going on behind the scenes.
When we tried to pass in user to ad marker typescript is going to take a look at ad marker.
It's going to see that the argument must be of type malleable to be malleable.
You have to have location with the latitude longitude.
So behind the scenes typescript is automatically inspecting what type user is and it's checking to see
if user satisfies the mapping tool interface.
So typescript is going to look at our definition of what a user is.
That's going to see that user has a location a latitude an analog to that are numbers.
And because it has those it satisfies the magical interface.
So typescript has no issue with us whatsoever passing a user into this method because user correctly
implements that interface.
Remember that that comparison of looking at user and making sure it has all the correct properties is
invisible and it occurs behind the scenes.
So we did not have to add in any code whatsoever to say hey typescript makes sure that user is mapping
all we didn't do anything like that.
We never said anything inside of our user class to say specifically hey this thing is supposed to be
malleable.
Never did it typescript is doing that comparison for us automatically we refer to this as an implicit
check typescript is implicitly or kind of behind the scenes automatically making sure that user has
the correct properties with the correct types inside of it to be an argument to add marker.
All right so last thing here I'm gonna save index dot to yes I'm going to flip back over my browser
refresh and everything still works as expected.
Perfect.
OK.
So this looks pretty good.
So he now seen something really awesome around interfaces but we're not done yet.
Let's take a quick pause.
When come back the next video we're going to add in one more feature to this application.
So quick break and I'll see you in just a minute.