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 ago, but let's
pull open that code snippet that we wrote back inside my Variables X 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 now 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, let's flip back over 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
in to 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 are 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 inferences, 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 annotate it as best we can.
All right.
So back inside my code editor, I'll find that annotations directory we had created.
I'm going to make a new file in there and call it Functions Dotts.
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 head out 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 No.
Same thing for me as well, right after being 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 ad function was going to add to numbers and return the result.
So it makes sense that this thing will return a number as well.
To add in 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 in, you'll see that I get a ER right here again, this time it's saying that
I have 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 er 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 to the next video and dissect this thing just a little bit more.
So I'll see you in just a minute.