We've now gotten an example of type annotations with the res classes and object literals, once again,
I just want to remind you that we're going to have a separate section on ARray's classes and object
literals as well.
So all I'm trying to do right now is kind of give you a sample of some of the syntax that we're going
to need to understand to get through some of the more complicated stuff.
The last example I want to give you down here, they type annotation is for a function.
Function, there we go, so unfortunately, the annotation for a function is kind of the nastiest syntax,
but you're going to see so many examples of it that you're going to understand it really quickly inside
this course.
So I'm going to first declare a function and it's going to look like a normal function and then we'll
come back to it and add in the type annotation.
So I'm going to make a new function called log.
No, this is going to be an arrow function and I'm going to call it with a No.
I and then inside the function, I'm going to add in a console log for I.
And you'll notice that I've got a little underline right here just to get the underline to go away.
I'm going to add on I Colen no like so we don't need to worry about the syntax just yet.
That is not the annotation we are worried about here.
So let's just kind of ignore that for a second.
Once again, we're going to have a separate section for functions just as we are for these other types
of values as well.
Right now, all I want to figure out is how we can add on a type annotation or log number right here.
Remember, we want to use a type annotation to describe what type of value we are signing to a variable.
So I want to add in some code that's going to tell TypeScript some information about this function.
And in all the other examples we've done so far, the syntax has been sometimes a little bit weird,
but more or less understandable.
So, for example, up here with the arrays, we put down string and then the square brackets to indicate
this was going to be an array in the case of a string.
Well, that was really easy.
We just wrote out the word string.
And then we saw with an object literal, we described the different properties and types, we're of
the different properties and types of values that the object would have.
So in the case of a function, we're going to do something similar.
We first need to think about what properties we really care about, what they function.
Well, with a function, what you and I really care about as developers is what arguments are going
to go into the function and what different types of values we expect the function to return.
So that's the information we're going to encode inside the sanitation, inside the annotation that goes
right here.
We're going to try to tell typescript what different arguments the function is going to take and what
different values it is going to return.
So here's we're going to write out we're going to write out inside of your.
Right here, I'm going to put down a set of parentheses and inside there I'm going to provide an annotation
for the different arguments that go into the function.
So I'm going to say that this thing is supposed to receive a argument with the name of I.
That's going to be a No.
Then right after that set of parentheses, I'll put in an arrow and then right after that, I'm going
to list out the different values that I expect this function to return.
Now, in this case, I expect this function to return nothing.
So I'm going to use a very special type called void.
All right, so there's the full imitation.
I think you can agree with me that this is some really nasty syntax right here.
It's really hard to understand where the invitation begins and where the function begins.
So everything up to void, like right there, that's the annotation.
That is us trying to tell TypeScript what type of value, what we are going to assign to this variable
right here.
Everything on the right hand side of the equals is the actual function.
So this is the annotation.
That's like a comment of us trying to tell TypeScript what we are doing here.
It is not actual code that's going to be invoked.
So even though it really, really looks like a function in its own complete right, it is not a function
that we're going to run.
It is a description of a function.
And then on the right hand side of the equals sign is where we actually provide the implementation.
OK, I know once again, the syntax here is a little bit weird, but don't worry, we're going to have
that separate section on functions to really break down the syntax right here and really understand
what's going on.
All right, so we've now gotten an example of a type invitation with a bunch of different basic values,
so now that we've seen all these, I want to point out one thing that's really interesting here.
Let's take a look at this first declaration we did at the very top.
Right now, if you hover over Appel's, you'll see a little pop up that says, oh yeah, apples is always
going to refer to a number.
So here's the interesting thing.
I'm going to remove the type annotation.
I'm going to delete that and the colon as well.
And now if I hover over apples, I'll see the exact same thing I saw before, so somehow it looks like
I didn't really have to add in that annotation in the first place.
And that is the entire dynamic that we need to understand between these type annotations and these type
inferences.
We just learned how to add on a ton of code that are all type annotations, everything we just wrote,
all that new syntax, word type annotations, but in that file that we just put together, there was
not a single type annotation that was actually required, in other words, inside this file.
We did not have to add in a single one of these type annotations.
We can delete every single one of them.
And everything is still going to work just fine, I can delete all of them and I still see no errors
inside my code.
And in every case, if I hover over a given variable, you'll see that I still get a little popup telling
me what type of value each variable is.
So it's very clear that there's kind of more going on here than meets the eye.
So let's take a quick pause.
When we come back, the next video, we're going to start to understand this kind of tension between
type annotations and type inference.
So quick pause and I'll see you in just a minute.