- All the different type narrowing
that TypeScript can do is really incredible
but there's certain scenarios where TypeScript isn't able
to quite do all the type narrowing we want it to do.
So that's why it introduced this satisfies keyword.
Take for example, this code.
We have a simple todo type with a title string
due date that could be a string or a date
and it is complete Boolean.
Then down here I'm defining a todo
but I'm not actually typing it as a todo.
Right now, I'm just defining a todo.
I gave it a title, a due date, a complete property
and down here I'm just setting my date to the fourth date.
Now you will notice there is a problem with my code
that's not being picked up.
You can see I gave it a complete property
instead of an is complete property
and TypeScript isn't picking up on this typo
and that's because this todo right here
isn't actually typed as my todo type.
I need to manually tell TypeScript,
okay this is a todo type.
So I can come in here and say todo just like this
and now you can see I'm getting that error being picked up.
So if I change this to is complete,
you can see that that removes the error
and it fixes that problem for me, which is great.
But by doing this I've actually run into another error
and the reason for that is down here.
My due date now can be either a string or a date.
Even though in reality if we look at our code
as a normal person, not as TypeScript, well this todo,
I manually set the due date to a date.
So I know for a fact that this thing is a date
and before I actually type this as a todo,
TypeScript knew that this was a date
as you can see, I have no errors
but as soon as I try to give it this todo type
since the due date can be a string or a date,
TypeScript just takes the types
from the type that you've defined
and uses them instead of the types
inside of my actual object.
So to get around this problem, what we can do is
instead of actually defining our type right here,
we can instead after our object say that
it satisfies a particular type.
And by doing that it keeps all of the specific types
that we have here such as our due date being a date,
but it allows us to actually type it as something
like a todo.
So it'll pick up on any typos we have.
So here I can just say satisfies.
I'm gonna say it satisfies size, the todo type.
Now you can see that my due date is specifically only a date
and that's because here I specified it
as particularly a date.
When I hover over this todo, you can see
that the type before this todo is a title that is a string.
It's got a due date which is a date
and it is complete, which is true.
And if I were to spell this wrong by saying complete instead
you can see I'm now getting an error and it's saying,
hey, this needs to have an iscomplete property on it
instead of complete.
You can see right here.
And that's because we're saying it satisfies this todo type,
which means it has to meet the minimum requirements
of this type, but it can be more specific.
So in our case, the minimum requirement is a title
which is a string, which we have;
a due date, which is either a string or a date.
In our case we have a due date, which is a date
and it is complete property, which is Boolean
and that's why we're getting our error
'cause this is spelled incorrectly.
Now the reason this satisfies property is so nice
is because it allows you to keep the more specific types
that we've already defined.
For example, the fact our due date is a date
while making sure it actually follows the more generic type
that we want it to.
So essentially satisfies just says my more specific thing
must meet these minimum requirements.
If it does, that's great.
I'm not gonna get any errors
and I'm going to still get to keep
all my extra typing information that I had before.
So a lot of times when you're defining an object like this
that is supposed to be one type
and you wanna give it more specific information
than the actual type gives you,
that's where the satisfies property
which is relatively new to TypeScript is really amazing.
And if you're wondering when you may want to use this,
really you'll know you want to use this
when you want to type something as a particular type.
So in our case, we want to type this as a todo
but by doing so I lose my more specific information
such as the fact that this is a date.
So when you want to type something as one type,
but by doing so makes you lose the specific information
that makes working with TypeScript so nice.
That's the perfect use case
for where you want to use satisfies instead
because it allows you to keep that specific nature
while ensuring it follows that specific type.