In this video we're going to write out just a little bit of code to get a better idea of what's going
on with these types.
Now this first little bit of code that we're going to write around types is going to be really simple
and straightforward just to kind of hammer home some of the concepts we've been talking about but on
some of the other examples or other topics we're going to discuss very shortly we're going to write
out much more complete code snippets.
So anyways let's get started going to begin by flipping on over to my code editor I'm still inside of
my fetch Jason directory.
I'm going to change out into my workspace folder and then inside of here I'm going to make a new project
directory to hold all these different code snippets we're going to put together as we're going through
some basic features of typescript.
So I'm going to make a new directory here called features I'll then change into that directory and then
I'll open up my code editor inside their once my editor is open and then going to make a new file and
I'm just gonna call it Type start to yes.
So like I said I just want to write out one or two quick snippets of code just to get a better idea
of what's going on so I want you to remember that the entire idea behind this type system is that it
is an easy way for us to refer to the different properties and functions that a value has.
In addition every value everything that we can assign to a variable has a type.
So to get started I'm going to flip back over my code editor and I want to just try creating a variable
that's going to point to an instance of a data object.
So I'll say Conte's today is going to be new date.
Like so if I hover over that variable my editor will then tell me the type of value that this variable
is pointing at.
So this is saying that the today variable is pointing at an object of type date typescript can now use
that information to decide exactly what we can do with that variable.
So for example if I put down today and then a dot I see my autocomplete pop up right here.
This is listing out all the different functions and properties that a date object has typescript only
knows to show this information right here because it has an internal definition of exactly what a date
is.
In other words typescript knows the properties and methods that a date has.
So can print them up in this list right here and I can easily select one and call it like so and then
as we saw just a moment ago because typescript knows what methods a date has and what properties it
has if we tried to reference one that doesn't exist we will very quickly get an error message.
So that's the whole point of types.
It is a shortcut to say here are the different properties and methods that this value right here has
okay.
So that's an example of looking at the type that a date object brings up let's now try creating and
a plain javascript object it's all say something like const person is going to be an object like so
and I'll give this person how about like just an age of 20 if I now hover over that person variable
I'll see a person or council person excuse me and then right after that.
In this case I don't get a nice name for the type because I've not actually given this object right
here a name is shorten name so we can kind of see our definition that of a type kind of holds up here.
If we don't have a shortened definition of what this object is then typescript is just going to default
to printing out all the different properties and methods that the object has.
So in this case it has just an age that is a number and once again if we tried to reference some property
on that variable that doesn't actually exist we're going to get an error message.
Okay just one more quick example here.
So down here I'm going to try to create a class I'll call it color I'm not going to give it any implementation.
Now even if you don't know what a class is that's really fine we're gonna go into great detail on classes
later on I can now use this class to make a new instance of a color.
So I'll say like say const red is new color like so and now just as we've seen twice before now by hover
over red typescript knows that this variable is pointing at an object that is of type color that means
that this variable right here has access to all the properties and all the methods that a color object
has in this case none because we haven't actually implemented anything here and we can see that if we
write out a red and then dot like so there are no properties associated with this class of color so
we don't get any autocomplete whatsoever.
If I try to reference anything as usual I'll get a very quick error message here as well okay.
Such as a couple of quick example examples of types.
So let's take a quick pause right here.
We're going to wrap up this idea of types with a quick discussion really quick I promise on where we're
going to use types in a normal project.
So quick pauses.
I'll see you in just a minute.