1
00:00:01,230 --> 00:00:06,660
In this video we're going to start to cover our first big topic which is basic types in typescript for

2
00:00:06,660 --> 00:00:08,130
every topic that we go through.

3
00:00:08,130 --> 00:00:10,260
Here's the game plan we're going to try to follow.

4
00:00:10,260 --> 00:00:14,190
First off we're going to get a plain definition an overview of the subject.

5
00:00:14,280 --> 00:00:17,230
We're then going to talk about why we care about each feature.

6
00:00:17,490 --> 00:00:22,020
In some cases we're gonna discuss features in typescript that I really don't think you're gonna use

7
00:00:22,020 --> 00:00:22,900
that often.

8
00:00:22,900 --> 00:00:24,640
And so I want to kind of make that clear.

9
00:00:24,660 --> 00:00:28,710
You know I want you to understand why do we care about these features and like how often will you actually

10
00:00:28,710 --> 00:00:29,300
use them.

11
00:00:29,910 --> 00:00:33,810
After that we'll then take a look at some different examples inside of our code.

12
00:00:33,820 --> 00:00:38,820
Ed by actually writing out some code and then finally we'll close every topic out with a discussion

13
00:00:38,880 --> 00:00:40,860
of when to use it.

14
00:00:40,860 --> 00:00:45,420
Sometimes when to use it is gonna be a little bit quick and it will really be in some the applications

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

16
00:00:50,050 --> 00:00:50,280
OK.

17
00:00:50,310 --> 00:00:51,830
So that's a flow we're going to go through.

18
00:00:51,840 --> 00:00:54,500
Like I said our first topic is going to be basic types.

19
00:00:54,510 --> 00:00:55,900
So let's get to it.

20
00:00:55,980 --> 00:01:00,120
Let's begin with a plain definition or as plain as I can make it.

21
00:01:00,210 --> 00:01:04,140
Now I'm sure if you open up a dictionary you're going to find a very academic definition of what a type

22
00:01:04,140 --> 00:01:04,770
is.

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

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

25
00:01:15,540 --> 00:01:21,490
that a value has and there's a lot of meaning in the statement right here so let's kind of break it

26
00:01:21,490 --> 00:01:22,790
apart piece by piece.

27
00:01:22,810 --> 00:01:24,650
First off what is a value.

28
00:01:24,700 --> 00:01:30,010
Well a value in JavaScript and typescript is anything that we can assign to a variable.

29
00:01:30,010 --> 00:01:31,780
So what can we assign to variables.

30
00:01:31,780 --> 00:01:42,670
Well we can assign strings numbers boolean is no undefined objects functions classes arrays and so on.

31
00:01:42,670 --> 00:01:51,430
So all of those different things have types in array has a type A object has a type a function has a

32
00:01:51,430 --> 00:01:55,060
type A class has a type and so on.

33
00:01:55,150 --> 00:01:56,820
Let's now break down the first part of the statement.

34
00:01:56,830 --> 00:02:01,350
What does what do I mean by an easy way to refer to the different properties and functions.

35
00:02:01,360 --> 00:02:05,120
Well to answer that maybe you'll be easier to take a look at a quick diagram.

36
00:02:05,350 --> 00:02:05,690
All right.

37
00:02:05,690 --> 00:02:09,950
So in this diagram right here I want you to take a look at this box right here and I want you to answer

38
00:02:09,950 --> 00:02:10,910
a question for me.

39
00:02:11,120 --> 00:02:15,190
Here's the question what is inside that box.

40
00:02:15,500 --> 00:02:17,170
Like what is in there.

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

42
00:02:19,850 --> 00:02:23,010
Maybe one would be to simply say it is a string.

43
00:02:23,060 --> 00:02:28,700
Alternatively if you wanted to give me a more detailed answer you might say is a value that has all

44
00:02:28,700 --> 00:02:35,960
the properties and methods that we assume that a string has to really understand that part.

45
00:02:36,020 --> 00:02:40,350
I think we would really need to understand what different properties and methods a string has.

46
00:02:40,370 --> 00:02:45,170
Here's a short list of just some of the functions that belong to a string in JavaScript.

47
00:02:45,380 --> 00:02:51,920
So every string in JavaScript has access to the character at function and can cut and includes an index

48
00:02:51,920 --> 00:02:59,290
of and so on if I had to tell you what this thing is right here by listing out all the different functions

49
00:02:59,290 --> 00:03:00,400
that belong to it.

50
00:03:00,400 --> 00:03:02,370
That would be really inconvenient.

51
00:03:02,410 --> 00:03:06,640
In other words if I asked you what is inside this box and you responded to me.

52
00:03:06,640 --> 00:03:12,370
Oh yeah Steven that is a value that has the function character at and can cat and includes an index

53
00:03:12,370 --> 00:03:15,700
of and so on that would be super inconvenient.

54
00:03:15,940 --> 00:03:23,080
So instead as a shortcut to describe what property is in function this thing has you summarize it in

55
00:03:23,080 --> 00:03:24,060
a single word.

56
00:03:24,070 --> 00:03:31,900
You tell me this is a string so when we referred to that type of a value it is a shortcut to refer to

57
00:03:31,900 --> 00:03:40,260
the different methods and properties that that value has every value that we create has a type assigned

58
00:03:40,260 --> 00:03:41,010
to it.

59
00:03:41,010 --> 00:03:44,310
In some cases that type is can be really obvious like in the case of the string right here.

60
00:03:45,030 --> 00:03:49,770
However in some other cases we're going to learn that types exist that are tied to values that you kind

61
00:03:49,770 --> 00:03:51,260
of wouldn't expect.

62
00:03:51,270 --> 00:03:56,640
So for example let's take a quick glance at that application we just worked on a moment ago remember

63
00:03:56,670 --> 00:04:02,310
inside of here we created an interface called to do when we created this interface we created a new

64
00:04:02,310 --> 00:04:06,740
type inside of application and that types name was to do.

65
00:04:06,990 --> 00:04:11,430
So there are two ways that I could have referred to this response debt data thing right here.

66
00:04:11,430 --> 00:04:12,720
I could have either told you.

67
00:04:12,780 --> 00:04:13,250
Oh yes.

68
00:04:13,260 --> 00:04:19,040
Response not data is an object that has an I.D. property a title property and a completed property.

69
00:04:19,410 --> 00:04:23,650
But if I had to repeat that statement every single time you asked me what this variable was.

70
00:04:23,850 --> 00:04:26,220
It would be just really inconvenient.

71
00:04:26,220 --> 00:04:29,590
So instead we formed a shortcut instead.

72
00:04:29,760 --> 00:04:37,890
I can say response dot data is a to do and instantly you understand what response dot data is.

73
00:04:37,920 --> 00:04:44,310
It is an object that has an I.T. title and completed property okay.

74
00:04:44,340 --> 00:04:50,910
So to sum up here the big takeaway is that when we start to discuss types in typescript these are just

75
00:04:51,000 --> 00:04:51,930
shortcuts.

76
00:04:51,930 --> 00:04:58,400
They are labels for describing the different properties and method methods that a single value has.

77
00:04:58,500 --> 00:05:04,050
And then the secondary statement to that is that every value in typescript has a type.

78
00:05:04,050 --> 00:05:06,350
Every single one of them okay.

79
00:05:06,370 --> 00:05:07,860
So let's take a quick pause right here.

80
00:05:07,900 --> 00:05:11,500
We're gonna come back the next video and start to expand on types just a little bit more.