In this lecture, we're going to look at how to annotate variables for this demonstration.
Let's work inside a new file.
I'll create a file called variables dots.
Inside this file, we will create a variable called my name will set this variable to a string.
Variables can be annotated with the same syntax we used for annotating function arguments and return
values after the variable name.
We will add a colon, followed by the data type since we're storing a name.
It makes sense to set the data type two string.
It's as simple as that.
You may be wondering, what types can we use and type annotation?
Every primitive type is supported in TypeScript.
I'll add a comment above to list them the following types are supported.
String No.
Boolean No and undefined.
By annotating variables, we can't reassign the variable to a different type.
If we ever reassign the variable, the value must be of the same type.
For example, if we were to update the mining variable to a number, we would encounter an error.
If we hover our mouse over the reassignment, we will get an error telling us we can't use a number.
This is because we're restricted to strings.
If we were to change the value to another string, the error goes away.
One of the cool things about TypeScript is type inference, admittedly, adding type annotations can
make our code seem cluttered.
They're incredibly helpful.
We should take every opportunity to make our code simple and clean.
TypeScript is intelligent to detect the data types of our variables.
This feature is called type inference.
Let's remove the type annotation from the variable.
Even though we've removed the annotation, TypeScript will set the variables data type to a string.
If we hover our mouse over the variable name, the editor will tell us the type is set to string.
How is this possible?
It's because of our value.
If a variable is initialized with a value, typescript will infer the type based on the value.
In this example, we're setting the mining variable to a string.
Therefore, TypeScript will infer the variable is a string below.
If we were to set the variable to a number, we would get the same error as before.
This feature is incredibly convenient.
We should always take advantage of this feature whenever we can.
It's redundant to set the type if TypeScript is capable of inferring the type for us for the rest of
this course.
If TypeScript can infer the type, we will let it set the type.
There are some limitations.
Firstly, it only works if the variable is initialized with a value.
If we were to omit the value, TypeScript would not infer the data type.
For example, if we remove the value and then hover our mouse over the name, the type is set to any.
The any type is given to a variable when TypeScript isn't sure what data type to use, it allows for
a variable to store any type of value.
We can store numbers, strings, objects, et cetera.
If we were to switch between different data types, TypeScript wouldn't throw an error.
To be clear, this data type is exclusive to TypeScript.
In some cases, you may want this behavior.
However, most of the time we want to be strict with our data types.
I'll revert this variable to its original value.
The second limitation we should be aware of is that this feature is not available to function parameters.
Let's switch over to the example Dot's file for a moment.
Next, we will remove the type annotations from the parameters.
After removing them, TypeScript will annotate both parameters with the any type, even though we're
passing in numbers, TypeScript still doesn't know what data type the parameter should be.
I'll add the annotations back to the function.
That's about it, for variables will continue in the next one.