In the last video, we started to explore type annotations around simple types like number, string,
boolean and some built in objects as well.
We're not going to write out a couple of examples that use some more complicated syntax.
So first, start off with trying to add in a type annotation for an array.
In this example, I'm going to try to make a new variable called colors, and I want to try to assign
it a array of strings and maybe these strings will be like red, green and blue because, hey, we're
calling this thing colors.
So to indicate that, I'll add on an annotation of string and then square brackets like so.
So this tells TypeScript that we're going to assign an array indicated by the square brackets that's
going to contain nothing but strings inside of it.
So I can then place my equals sign and then place the real array and say red, green and blue.
So the important thing here to understand is that the sanitation and specifically this bracket right
here is not creating an array.
This is saying we're going to have something assigned to colors that is of type array that contains
strings.
One of the more complicated things in the world of TypeScript, I think is kind of separating all this
new type annotation, syntax and understanding when we are actually creating an array like as we are
here on the right hand side, and when we are trying to indicate a type of array, as we're doing here
on the left hand side.
Now we're going to go into great examples or much more detail with the raise in just a couple of videos.
So for right now, let's just kind of sit on this example right here and say if we ever want to create
a type annotation for an array of strings, that's how we would do it.
We can do the same thing with, say, maybe an array of numbers as well.
So let's say, how about let my numbers for lack of a better name and I'll put down that type of value
that I'm going to have inside of the array, which in this case will be a number than empty square brackets,
an equal sign, and then my real array like so.
And the same thing with booleans as well, so I could say that I don't know, truth's how about that
metal work that's going to be a boolean or an array of booleans and I'll set it equal to true.
True, false like so.
Like I said, we're going to go into greater detail with a raise in just a moment, so we'll just hang
it right there.
So for our next example, let's take a look at how we would deal with classes, with type annotations,
so I'll put down another section here called Classes, and we'll create a class called car that's going
to make an empty class like so.
Classes are another thing that we're going to go into great detail in this course again for right now,
I just want you to understand how we can add in a type invitation with an instance of class car.
So I could create a new variable down here and call it, say, lowercase car.
Well, then put the call in and then the type of the variable or the type of value that we're going
to assign to car in this case, I want to make an instance of class car.
So I'm going to say that my type is Capital C car, and this is where things start to get really crazy
if you've never worked a lot with classes before.
Traditionally, we create classes with capitalized names.
So whenever you see a capital name like this, like capital car, that means we are referring to the
type of class car.
And usually whenever we have a fully lowercase name, as you see right here, we have a variable that's
referring to an instance of a car.
So we're saying the variable car is only ever going to refer to an instance of a car.
We can then place our equals sign and then make a new car, and that's what creates our instance.
All right, so now one more or two more quick examples here.
We'll take a look at how we add in a type annotation for an object literal.
This is where the syntax starts to go a little bit more challenging, but functions are even a little
bit worse.
So, hey, let's just hang in there for right now.
I want to try creating an object and adding in a type annotation for it.
I'm going to first create the object and we'll discuss how we can add in the annotation.
So I'll make a new variable called Point, and I'm going to assign that to an object with an X value
of ten and a Y value of how about 20 like so.
So how would we add in a type invitation for this?
Well, just like before, we'll add in a colon and then we'll add in some syntax right here to describe
what type of value we're going to assign to point.
Now, the only difference this time around is that the syntax is going to look a little bit nasty.
So to indicate that we're going to assign an object that has an X property that's a number and a Y property
to number to the variable point, we're going to put the colon and then a set of curly braces and then
we'll list out all the different property names with the respective types right inside of that set of
curly braces.
So I'm going to say that the object that we're going to assign a point is going to have an X property.
That's a no.
I'll then put in a semicolon.
And then I'll say that it's going to also have a Y property that's a number as well.
I only have to put in a semicolon when I'm separating different types inside of a year or different
property names, so I do not technically have to put in a colon after the property, although I can
if I want to.
It's like I said, this is where things start to get a little bit crazy, once again, we are declaring
a variable called point.
We are assigning it an object that has an X property in a Y property.
And then we are simultaneously adding in a type annotation for point as well, and we're saying we can
only ever assign an object to a point that has an X property that's a number and a Y property.
That's a number as well.
So just as we saw a moment ago, back up here at the top, we saw very simply, if we assign a bad value
on the right hand side, that doesn't agree with the type on the left hand side.
We very quickly see an error message so that same rules applies with an object as well.
For example, if I make the property right here a string, instead, I'll see an error message that
says that I have the property called X, but I'm trying to provide a value that is a string instead
of the number that I said I was going to provide.
So I'll change that back over to 10 and now the air goes away.
Likewise, if I do not provide all the required property values, like, for example, instead of why
I instead do something like a I'll see an error message as well.
And the air says, hey, you're trying to give something that has property A..
But we were expecting to see something has why instead.
So the same rule applies, the syntax is just a little bit nastier.
All right.
Let's do one more quick pause in the next video, we'll take a look at these Syntex around functions
and we'll talk about why we care about all these type annotations.
So quick pause and I'll see you in just a minute.