1 00:00:00,570 --> 00:00:03,840 In the section we're gonna start to discuss classes in typescript. 2 00:00:03,840 --> 00:00:08,100 As usual we'll get a plain definition some examples and then move on to discussing where we're going 3 00:00:08,100 --> 00:00:10,110 to actually use classes. 4 00:00:10,110 --> 00:00:14,700 This is the last big subject we're going to discuss before we start working on some interesting applications. 5 00:00:14,700 --> 00:00:16,280 So let's get to it. 6 00:00:16,320 --> 00:00:21,110 All right so first off definition so a class is a blueprint of sorts. 7 00:00:21,120 --> 00:00:25,220 We are writing code here but it's a blueprint print or a model of sorts. 8 00:00:25,260 --> 00:00:30,470 We're going to use to create an object that has some different fields and methods attached to it. 9 00:00:30,480 --> 00:00:36,150 We use these classes to represent different things or objects inside of our application. 10 00:00:36,150 --> 00:00:40,450 Now whenever I say fields I'm referring to different values that are going to be attached to an object. 11 00:00:40,470 --> 00:00:46,750 And whenever I say methods where return referring to different functions they'll be attached to an object. 12 00:00:46,780 --> 00:00:50,590 Now we're going to break covering classes into kind of two separate subjects. 13 00:00:50,590 --> 00:00:54,970 We're going to first discuss how classes work with methods or functions and then come back and add in 14 00:00:54,970 --> 00:00:57,360 the idea of fields and values to them. 15 00:00:57,430 --> 00:00:58,700 So let's get to it. 16 00:00:58,750 --> 00:01:02,200 It's going to flip on over my code editor in inside my project directory. 17 00:01:02,200 --> 00:01:07,870 I'm gonna make a new file called it classes dot yes then inside of here I wanted to find a new class 18 00:01:07,900 --> 00:01:12,950 that's going to represent a vehicle very similar to what we did in the last little example we went through. 19 00:01:13,210 --> 00:01:19,540 So I'm going to write out a new class definition by using the class keyword and then the name of the 20 00:01:19,540 --> 00:01:20,540 class. 21 00:01:20,920 --> 00:01:26,650 We're always going to capitalize the name of a class then inside of this class body we can define different 22 00:01:26,650 --> 00:01:28,010 methods. 23 00:01:28,150 --> 00:01:35,110 So I might write out a method called Drive all annotated as taking no arguments and maybe a return type 24 00:01:35,110 --> 00:01:43,210 of void in inside of here maybe else do a quick console log and say something like chug it sugar when 25 00:01:43,210 --> 00:01:49,060 we create a class we are creating a blueprint or a definition of what a vehicle should be. 26 00:01:49,270 --> 00:01:52,110 We don't actually call the methods attach this class directly. 27 00:01:52,180 --> 00:01:55,480 In some cases we can but with normal methods we do not. 28 00:01:55,480 --> 00:02:02,140 Instead we're going to use a class to create an instance of a class to do so we're going to use the 29 00:02:02,140 --> 00:02:03,010 new keyword. 30 00:02:03,010 --> 00:02:10,210 So for example down here we might say const vehicle is new vehicle like so notice a capitalization that 31 00:02:10,210 --> 00:02:10,960 we're using here. 32 00:02:10,960 --> 00:02:15,480 Traditionally we're going to name all of our different classes with a capital letter and then anytime 33 00:02:15,490 --> 00:02:20,830 we have an instance of that class well you will sometimes use the same word but spell it out with lowercase 34 00:02:20,830 --> 00:02:22,400 like so. 35 00:02:22,420 --> 00:02:26,530 So now with this instance of the class we have access to all the different methods we define inside 36 00:02:26,530 --> 00:02:27,140 there. 37 00:02:27,160 --> 00:02:33,310 So for example we could do something like vehicle dot drive like so now we've not been running a lot 38 00:02:33,310 --> 00:02:37,060 of the different code examples we've put together but with classes it's really important to actually 39 00:02:37,060 --> 00:02:40,180 execute some code so you get a really good idea of what's going on. 40 00:02:40,180 --> 00:02:45,290 So I got to very quickly save this file and then flip back over to my terminal to run it back inside 41 00:02:45,290 --> 00:02:50,390 my project directory remember we can run some code with T.S. dash node and then the name of the file 42 00:02:50,480 --> 00:02:56,780 in this case classes dot t yes you know I can see the council log up you're right there we can attach 43 00:02:56,780 --> 00:03:01,730 as many methods as we want to to a class so for example this class might also have a method called hunk 44 00:03:02,480 --> 00:03:08,240 it's not going to return anything in a time I call it maybe we will do a console log of beep like so 45 00:03:09,330 --> 00:03:14,320 so we can save this file flip back over once again oh one thing I forgot here sorry. 46 00:03:14,320 --> 00:03:17,620 Down here at the bottom we want to make sure we also call that method we just added so we'll do a quick 47 00:03:17,980 --> 00:03:23,920 vehicle dot honk like so now we'll say the file flip back over and then run that file again and now 48 00:03:23,920 --> 00:03:29,370 we can see that beep appear now I'm going to sue if you're in this course you've probably seen classes 49 00:03:29,370 --> 00:03:33,100 before so I just want to make sure you got a quick reminder some the basics around them. 50 00:03:33,360 --> 00:03:36,660 Let's take a quick pause right here when we come back the next video we're going to start to discuss 51 00:03:36,870 --> 00:03:43,950 how classes in typescript are a little bit different than classes in a traditional like yes 2015 javascript 52 00:03:44,460 --> 00:03:46,350 so quick pause and I'll see you in just a minute.