1
00:00:01,110 --> 00:00:05,930
In this video, we're going to start to cover our first big topic, which is basic types in TypeScript

2
00:00:06,510 --> 00:00:09,690
for every topic that we go through, here's the game plan we're going to try to follow.

3
00:00:10,200 --> 00:00:13,740
First off, we're going to get a plain definition and overview of the subject.

4
00:00:14,220 --> 00:00:16,920
We're then going to talk about why we care about each feature.

5
00:00:17,370 --> 00:00:21,780
In some cases, we're going to discuss features in typescript that I really don't think you're going

6
00:00:21,780 --> 00:00:22,590
to use that often.

7
00:00:22,830 --> 00:00:24,560
And so I want to kind of make that clear.

8
00:00:24,780 --> 00:00:29,180
I want you to understand why do we care about these features and how often will you actually use them

9
00:00:29,790 --> 00:00:30,480
after that?

10
00:00:30,510 --> 00:00:34,980
Will then take a look at some different examples inside of our code editor by actually writing out some

11
00:00:34,980 --> 00:00:35,370
code.

12
00:00:35,760 --> 00:00:40,170
And then finally, we'll close every topic out with a discussion of when to use it.

13
00:00:40,800 --> 00:00:45,420
Sometimes when to use it is going to be a little bit quick and it will really be in some of the applications

14
00:00:45,420 --> 00:00:49,140
we put together that you're going to discover when we use some of these different features.

15
00:00:49,930 --> 00:00:54,010
OK, so that's a flow we're going to go through, like I said, our first topic is going to be basic

16
00:00:54,010 --> 00:00:54,460
types.

17
00:00:54,460 --> 00:00:55,630
So let's get to it.

18
00:00:55,910 --> 00:00:59,550
Let's begin with a plain definition or as plain as I can make it.

19
00:01:00,160 --> 00:01:03,760
Now, I'm sure if you open up a dictionary, you're going to find a very academic definition of what

20
00:01:03,760 --> 00:01:04,450
a type is.

21
00:01:04,720 --> 00:01:08,560
But if I had to use my own words to describe what a type is, here's what I would say.

22
00:01:09,070 --> 00:01:15,520
I would say that in typescript, a type is an easy way to refer to the different properties and functions

23
00:01:15,520 --> 00:01:16,630
that a value has.

24
00:01:18,710 --> 00:01:22,160
And there's a lot of meaning in the statement right here, so let's kind of break it apart piece by

25
00:01:22,160 --> 00:01:22,550
piece.

26
00:01:22,760 --> 00:01:24,110
First off, what is a value?

27
00:01:24,650 --> 00:01:29,490
Well, a value in JavaScript and TypeScript, is anything that we can assign to a variable.

28
00:01:29,930 --> 00:01:31,280
So what can we assign to variables?

29
00:01:31,730 --> 00:01:40,340
Well, we can assign strings, numbers, booleans, null, undefined objects, functions, classes,

30
00:01:40,340 --> 00:01:41,830
arrays and so on.

31
00:01:42,620 --> 00:01:49,610
So all of those different things have types in array, has a type A object has a type.

32
00:01:50,470 --> 00:01:53,530
A function has a type, A class as a type and so on.

33
00:01:55,050 --> 00:01:59,130
So let's now break down the first part of the statement, what is what do I mean by an easy way to refer

34
00:01:59,130 --> 00:02:00,840
to the different properties and functions?

35
00:02:01,320 --> 00:02:04,200
Well, the answer that maybe would be easier to take a look at a quick diagram.

36
00:02:05,130 --> 00:02:09,240
All right, so in this diagram right here, I want you to take a look at this box right here, and I

37
00:02:09,240 --> 00:02:10,919
want you to answer a question for me.

38
00:02:11,070 --> 00:02:11,820
Here's the question.

39
00:02:12,270 --> 00:02:15,690
What is inside that box like?

40
00:02:15,690 --> 00:02:16,430
What is in there?

41
00:02:17,130 --> 00:02:19,650
I think you can probably give me two answers.

42
00:02:19,770 --> 00:02:22,410
Maybe one would be to simply say it is a string.

43
00:02:22,990 --> 00:02:28,380
Alternatively, if you wanted to give me a more detailed answer, you might say is a value that has

44
00:02:28,380 --> 00:02:32,850
all the properties and methods that we assume that a string has.

45
00:02:34,590 --> 00:02:38,400
So to really understand that part, I think we would really need to understand what different properties

46
00:02:38,400 --> 00:02:39,610
and methods a string has.

47
00:02:40,320 --> 00:02:44,780
Here's a short list of just some of the functions that belong to a string in JavaScript.

48
00:02:45,330 --> 00:02:51,900
So every string in JavaScript has access to the character at function and concat and includes an index

49
00:02:51,900 --> 00:02:52,740
of and so on.

50
00:02:53,950 --> 00:02:59,380
If I had to tell you what this thing is right here, by listing out all the different functions that

51
00:02:59,380 --> 00:03:02,060
belong to it, that would be really inconvenient.

52
00:03:02,290 --> 00:03:07,330
In other words, if I asked you what is inside this box and you responded to me, oh, yeah, Steven,

53
00:03:07,330 --> 00:03:14,080
that is a value that has the function character at and concat and includes an index of and so on that

54
00:03:14,080 --> 00:03:15,650
would be super inconvenient.

55
00:03:15,880 --> 00:03:22,810
So instead, as a shortcut to describe what property is and function this thing has, you summarize

56
00:03:22,810 --> 00:03:24,040
it in a single word.

57
00:03:24,040 --> 00:03:26,380
You tell me this is a string.

58
00:03:27,510 --> 00:03:33,060
So when we referred to the type of a value, it is a shortcut to refer to the different methods and

59
00:03:33,060 --> 00:03:35,550
properties that that value has.

60
00:03:36,960 --> 00:03:42,540
Every value that we create has a type assigned to it, in some cases, that type is going to be really

61
00:03:42,540 --> 00:03:44,310
obvious, like in the case of this string right here.

62
00:03:44,940 --> 00:03:49,500
However, in some other cases, we're going to learn that types exist that are tied to values that you

63
00:03:49,500 --> 00:03:50,640
kind of wouldn't expect.

64
00:03:51,180 --> 00:03:55,590
So, for example, let's take a quick glance at that application we just worked on a moment ago.

65
00:03:56,190 --> 00:03:59,280
Remember, inside of here, we created an interface called to do.

66
00:03:59,880 --> 00:04:05,130
When we created this interface, we created a new type inside of our application and that type of name

67
00:04:05,130 --> 00:04:07,110
was to do so.

68
00:04:07,110 --> 00:04:11,430
There are two ways that I could have referred to this response data thing right here.

69
00:04:11,430 --> 00:04:17,010
I could have either told you, oh, yes, response not data is an object that has an ID property, a

70
00:04:17,010 --> 00:04:18,839
title property and a completed property.

71
00:04:19,350 --> 00:04:24,030
But if I had to repeat that statement every single time you asked me what this variable was, it would

72
00:04:24,030 --> 00:04:25,740
be just really inconvenient.

73
00:04:26,160 --> 00:04:28,560
So instead, we formed a shortcut.

74
00:04:29,130 --> 00:04:33,090
Instead, I can say response data is a to do.

75
00:04:33,420 --> 00:04:37,580
And instantly you understand what response DOT data is.

76
00:04:37,830 --> 00:04:42,420
It is an object that has an ID title and completed property.

77
00:04:43,830 --> 00:04:50,520
OK, so to sum up here, the big takeaway is that when we start to discuss types in TypeScript, these

78
00:04:50,520 --> 00:04:51,890
are just shortcuts.

79
00:04:51,900 --> 00:04:52,950
They are labels.

80
00:04:53,190 --> 00:04:57,900
We're describing the different properties and method methods that a single value has.

81
00:04:58,410 --> 00:05:04,620
And then the secondary statement to that is that every value in typescript has a type, every single

82
00:05:04,620 --> 00:05:05,010
one of them.

83
00:05:05,990 --> 00:05:07,610
OK, so let's take a quick pause right here.

84
00:05:07,850 --> 00:05:11,510
We're going to come back to the next video and start to expand on type's just a little bit more.