In this video we're going to continue talking about annotations and inference but rather than focusing
on how those features are applied to variables we're going to instead focus on how these features are
applied to functions.
So still talking about working with types but we're now talking about labeling functions as opposed
to variables.
Now you might be thinking that we already spoke about functions a couple of videos go but let's pull
open that code snippet that we wrote back inside my variables dot s file.
We can scroll down a little bit and see where we added in some type annotation around a function.
So here's the thing.
The annotation that we wrote out right here was an annotation for the variable we were telling typescript
hey we're going to assign a value to this variable that's going to have this type right here.
It's going to be a function it's going to take some argument and have some return value.
Again it was modifying the variable.
So now we're going to be moving on to the right hand side of that equal sign.
We're not going to focus on how we add annotations to the function itself how we annotate its input
arguments and its return values as well so with that mind.
Well let's flip back over a quick diagram here.
I want to give you a plain definition on what's going on with annotations and inference around functions.
All right.
Here we go.
So when we talk about type annotations around functions we are talking about code that we are adding
into our project that's going to help typescript along the goal of these annotations is to tell typescript
about the type of arguments that a function will receive any type of value that it will return.
So again we are adding in code here to help typescript along very similar to the type annotations we
were already adding in.
The big difference here is that we are no longer annotating a variable declaration.
Instead we are annotating the function itself now also with type inference.
We still have type inference working around functions as well.
Remember type of inference is that kind of automatic system where typescript is going to try to figure
out what is going on for us.
This same system applies to functions as well but there's one big difference type inference only works
around the return value from a function.
So typescript will try to figure out what value or what type of value you are returning from a function
but it will not try to figure out what type of value the arguments are now.
Both these definitions right here everything I just said I feel like is kind of confusing.
I think learning all this function stuff is a lot easier to look at some code snippets.
So let's flip over to our code editor we're going to write out a single function and annotated as best
we can.
All right.
So back inside my code editor I'll find that annotations directory we had created.
I'm gonna make a new file in there and call it functions dot T.S. so inside of here I want to write
out one single function called add this is going to be a function that's going to take two numbers as
arguments add them together and return the result so I'm going to receive those two arguments as names
a and b like so now as soon as I add in those arguments you'll notice I get a little warning if I hover
over them or just the first one it says here that a has a any type.
So right now typescript has no idea what type of value a is.
So to help typescript understand what's going on here we have to had on add on a type annotation to
do so right after the argument name will put in a colon and then the type of value that a will be.
So in this case it's going to be a number.
Same thing for B as well.
Right after B I'll put in a colon and then the type of value that B will be.
So we've now defined a function that's going to take two arguments A and B and they're both going to
be numbers.
Now the last thing we'll do is add in annotation for the type of value that the function is going to
return.
Remember we had said that the add function was going to add two numbers and return the result.
So it makes sense that this thing will return a number as well too adding that invitation right after
the argument list I'll put in a colon and then the type of value that the function will return in this
case a number as soon as I add that and you'll see that I get a air right here again this time it's
saying that I've a function whose type is neither void or any and it must return a value.
So all this is saying right here is that we just added in an annotation that said our function was going
to return a value that is a number but we don't have any return statement right now.
We don't have any code to actually return a number.
And so typescript is telling us hey your function isn't working as expected.
So to fix that error all we have to do is return a number.
So inside the function I will return a plus b like so.
And then that error goes away all right.
So this is a very basic example right here but it highlights some really important ideas around type
annotations for functions.
So let's take a quick pause we're going to come back the next video and dissect this thing just a little
bit more so I'll see you in just a minute.