Our application is now feature complete.
But I want to mention one last thing.
Around interfaces.
Just a second ago we added in a new requirement to our interface.
We said that in order to be considered to be marketable an object had to have a marker content method
that returned a string.
When we added in that additional requirement right there we saw errors pop up inside of our index dot
test file specifically where we were passing and user and company to add marker on to try adding in
a new property to interface manageable back inside of custom map and just see errors pop up again.
So inside of custom map I'm going to say that anything that wants to be considered to be malleable has
to also have How about a color property that is a string like so now as soon as I add that in I'll see
my index dot test file light up.
If I open that once again I will see errors around user and company.
So the discussion I want to have here is around where we see error messages.
Remember the entire goal of typescript is to help us find errors in our code.
And so part of that process is making sure that typescript can point us in the right direction and help
us find like the root source of an error.
So in this case we added in a new requirement to an interface.
And we're seeing an error appear where we actually try to pass in some value to this function.
Now I'm gonna suggest that maybe this is not the best place to see this error message.
Think about what we would have to do to fix this air at the end of the day.
If we want to make this error go away we have to open up our definition for a user like the User class
and the company class and modify those classes in both those classes we would have to add in a new property
of color to both them so because we would have to open up those class definitions seeing the air here
is not super useful.
It is useful to see an error.
Absolutely but it's not really pointing us to the exact location of where we should go to fix this problem
so I want to tell you how we can add in a little bit more code to help typescript point us in the correct
direction.
Here's what we're going to do inside of custom map.
I'm going to add in an export statement for the interface that we just added so we now have export interface
methyl.
So this is going to make the interface we can import this into other files and refer to this as a separate
type.
It's now going to go back over to user dot t s and at the top I'm going to import that interface so
I'm gonna import malleable from custom map and then inside of here I'm going to add in right after my
class definition I'm going to say implements malleable.
So what this does right here is it tells typescript we want to make sure that a instance of class user
like a user that we create satisfies all the properties required by the mapping will interface.
This sets up a very direct dependency between our User class and the custom map class or technically
the custom map file I suppose.
So we've now declared our intention to typescript we are saying we want every user recreate to satisfy
that interface because we eventually want users to be an argument to that ad marker function so by adding
in implements capital all right here we are telling typescript help us help us make sure user is implemented
correctly.
Help us make sure that user has all the properties specified by manageable if we now hover over a user
you'll see that it says OK property Color is missing on class user but it's required by that interface.
So now we have a additional error message inside of here that can help us pinpoint the source of the
error in our application right now.
We have something that says very specifically Hey you're a class user is not implemented correctly.
So we're still seeing an error message just like we were seeing the before inside of index dot yes.
But now the difference is that typescript is helping us point out the true source of the error it's
helping us understand that if we want this area to go away we have to update our user class definition.
So as you might guess we could fix this up by adding in a color property that is a string and I'll initialize
it as like you know red or some like that right there as well and as soon as I add that in air goes
away and the number of errors inside of index dot T.S. goes down to 1.
So again the entire idea behind this implements clause right here is we are telling typescript help
us satisfy this interface we want to make sure that user can be considered to be mapping all.
And so typescript is going to do some additional checking of our class and make sure we have all the
correct properties.
You do not have to do this.
This is not required at all.
The reason we would decide to add in this implements clause right here to a class is so that if we fail
to properly implement an interface typescript can point us to the true source of the error.
Our definition of the class as opposed to when we try to pass a value or an instance of that class into
a given function so he wanted to we could go through the same process with company as well inside of
company not to us.
We could add in an import statement for mapping all from custom map and then I'll say implements malleable
and now once again we get an error on company and it tells us we have to have color that is a string.
But we did not provide it.
So if we add in color that is a string and I'll just say red like so right there on the same line it
goes away and we're back to be imperfect All right.
So again hundred percent optional totally up to you.
You will see some projects that use this implements clause extensively to make sure that it's really
clear to TypeScript and even other engineers that we are trying to make sure that class company satisfies
that interface if you don't put it in.
No problem.
The only thing that's going to do is help typescript help you and help under their other engineers understand
what you are trying to do.
OK.
So quick pause right here and we'll wrap up this application for real this time in the next video.