1
00:00:00,530 --> 00:00:05,060
In this video, we're going to write out a couple of code examples to understand how type annotations

2
00:00:05,330 --> 00:00:07,180
work, specifically with variables.

3
00:00:07,730 --> 00:00:12,680
Remember, a type annotation is going to be a little bit of code that we write to help type script along.

4
00:00:13,670 --> 00:00:18,620
The type sanitation system is kind of at odds with type inference, so we're going to first focus on

5
00:00:18,620 --> 00:00:23,140
type annotations and then come along and understand how type inference comes into play.

6
00:00:24,050 --> 00:00:27,980
All right, so I'm going to change on over to my editor and inside my project directory, I'm going

7
00:00:27,980 --> 00:00:30,400
to make a new folder called Annotations.

8
00:00:30,890 --> 00:00:35,570
We're going to eventually create separate files inside this directory that are all related to type annotations.

9
00:00:35,750 --> 00:00:37,850
So we're going to organize them all inside of here.

10
00:00:38,570 --> 00:00:42,470
Inside this folder, I'm going to make a new file called Variables Dotty's.

11
00:00:43,280 --> 00:00:48,410
And then inside this file, I'm going to write out my first variable declaration that has a type annotation.

12
00:00:48,950 --> 00:00:52,340
So I'm going to write out const Appel's is going to be a number.

13
00:00:52,670 --> 00:00:54,920
I'm going to set that to five like so.

14
00:00:56,340 --> 00:01:02,610
So the colon and the word no, right after it is our type annotation, you're going to see syntax that

15
00:01:02,610 --> 00:01:06,420
looks exactly like this in the vast majority of typescript code that you work with.

16
00:01:07,170 --> 00:01:12,780
This type annotation is trying to tell typescript that we are only ever going to assign a value of type

17
00:01:12,780 --> 00:01:15,210
number to the variable of apples.

18
00:01:15,970 --> 00:01:20,760
If I ever tried to assign some other type of value besides a number, I'll very quickly see an error

19
00:01:20,760 --> 00:01:21,220
message.

20
00:01:21,750 --> 00:01:26,790
So, for example, if I update the five right here to true, which is a boolean, I'll see an error

21
00:01:26,790 --> 00:01:27,270
right away.

22
00:01:27,720 --> 00:01:31,560
And it tells me that the type of true is not assignable to a type of number.

23
00:01:33,030 --> 00:01:37,370
Now, this is also going to work if I try to update the value assigned to that variable as well.

24
00:01:38,130 --> 00:01:44,550
So if I update the keyword to let, which will allow me to reassign apples, I can then reassign apples

25
00:01:44,550 --> 00:01:46,710
down here, a value of ten without any issue.

26
00:01:47,620 --> 00:01:51,910
However, if I tried to assign it some other type of value, like a string, once again, I'll very

27
00:01:51,910 --> 00:01:52,750
quickly see an error.

28
00:01:53,550 --> 00:01:58,320
And once again, I see a message that says essentially you have a string and you're trying to assign

29
00:01:58,320 --> 00:02:00,000
it to a variable that's supposed to be a no.

30
00:02:01,860 --> 00:02:05,730
Now for the rest of this file, I want to show you some reassignments all over the place.

31
00:02:05,880 --> 00:02:10,590
So I'm going to continue using the key word, even though in just about all the declarations we're going

32
00:02:10,590 --> 00:02:14,070
to add here, usually I would be making use of the const keyword instead.

33
00:02:15,790 --> 00:02:19,430
Type annotations like this right here can be used with any type of value.

34
00:02:19,990 --> 00:02:23,320
Remember, we just spoke about some of the different types of values inside of TypeScript.

35
00:02:23,770 --> 00:02:30,190
So we've got no strings booleans, no void, null, undefined and functions, arrays and so on.

36
00:02:31,100 --> 00:02:37,070
So with every one of these different types of values, we can use a type annotation, let's write out

37
00:02:37,070 --> 00:02:41,480
a couple of examples just to understand how type annotation works with each of these different types.

38
00:02:43,020 --> 00:02:47,820
All right, so in every case, we'll right out let and then a variable name in this case, I'm going

39
00:02:47,820 --> 00:02:53,340
to call my variable speed than a colon, then the type of value in this case, I'm going to say it's

40
00:02:53,340 --> 00:02:57,900
going to be a string and I'm going to assign it a value of fast like so.

41
00:02:59,170 --> 00:03:03,610
Once again, if I tried to assign this a value that is not a string, so in this case, maybe a number,

42
00:03:03,610 --> 00:03:05,560
I'll see you there and that's pretty much it.

43
00:03:05,570 --> 00:03:09,910
We're going to see that same pattern repeating every time we tried to assign it a different type of

44
00:03:09,910 --> 00:03:10,300
value.

45
00:03:11,340 --> 00:03:16,260
Let's take a look at a boolean as well, so let's say maybe let his name is going to be a boolean of

46
00:03:16,260 --> 00:03:16,640
true.

47
00:03:17,430 --> 00:03:21,150
How about no, I'll make a variable called nothing much.

48
00:03:22,200 --> 00:03:25,730
And I'll make that null, and that's going to be assigned a value of no.

49
00:03:26,400 --> 00:03:27,890
Now, this is kind of interesting right here.

50
00:03:27,900 --> 00:03:30,510
It's our first example of where we have a value.

51
00:03:31,590 --> 00:03:33,700
That has a name identical to its type.

52
00:03:34,170 --> 00:03:38,190
We're actually going to see that a couple times in TypeScript, and it's something that's a little bit

53
00:03:38,190 --> 00:03:42,210
difficult to grasp once you start getting into some more complicated topics.

54
00:03:42,650 --> 00:03:46,170
We're going to have several lectures later on to understand when we're working with something that's

55
00:03:46,170 --> 00:03:48,750
a value and when we're working with something that is a type.

56
00:03:50,140 --> 00:03:54,790
We could also try a new variable called something like say nothing and make it undefined.

57
00:03:58,040 --> 00:04:02,900
Now, we can also use type annotation with every other type of value as well, like we just said, so

58
00:04:02,900 --> 00:04:08,390
I can use this with an instance of a class or with a built in object or just about anything you can

59
00:04:08,390 --> 00:04:08,900
imagine.

60
00:04:09,500 --> 00:04:12,050
So let's say that we're working with maybe a date object.

61
00:04:12,770 --> 00:04:18,500
I'll say I'll put a little section header here and I'll say built in objects so I can make a new variable

62
00:04:18,500 --> 00:04:19,490
called now.

63
00:04:20,740 --> 00:04:25,870
I'll say that's going to be a type date and then I'll make a new date and assign it on the other side.

64
00:04:26,680 --> 00:04:29,430
So in this case, we're once again doing the same thing we're doing up here.

65
00:04:29,440 --> 00:04:34,540
We're saying that we're going to have a variable called now and we can only assign it a value of type

66
00:04:34,540 --> 00:04:34,900
date.

67
00:04:35,560 --> 00:04:39,550
And then on the other side, we're going to assign it an instance of a date object.

68
00:04:40,860 --> 00:04:44,010
All right, so now that we're kind of getting the idea here, let's take a quick pause.

69
00:04:44,010 --> 00:04:47,940
When we come back in the next section, we'll take a look at some of the more complicated syntax that

70
00:04:47,940 --> 00:04:51,060
comes up when we start working with objects, arrays and functions.

71
00:04:51,360 --> 00:04:53,300
So a quick pause and I'll see you in just a minute.