1 00:00:00,710 --> 00:00:05,090 I know you spent a lot of time talking about annotations and inference but we've got just one last little 2 00:00:05,090 --> 00:00:07,880 sub topic to discuss which is objects. 3 00:00:08,060 --> 00:00:12,260 Now this discussion is going to go a lot more quickly because all we're really discussing here is how 4 00:00:12,260 --> 00:00:18,080 we do stuff like object structuring which we kind of saw an example of in argument lists just a second 5 00:00:18,080 --> 00:00:18,810 ago. 6 00:00:18,920 --> 00:00:23,690 So let's just flip directly back over to our code editor and talk about how to work with objects around 7 00:00:23,690 --> 00:00:24,680 this annotation stuff. 8 00:00:25,460 --> 00:00:31,220 So instead my annotations directory I'm going to make another file called objects not T.S. and then 9 00:00:31,220 --> 00:00:31,820 inside of here. 10 00:00:31,820 --> 00:00:37,400 I want to declare a new object called profile and this will be a profile for a person so maybe they 11 00:00:37,400 --> 00:00:39,690 have a name like Alex. 12 00:00:39,950 --> 00:00:46,300 Maybe they have an age like 20 and we'll say that this person also has some coordinates like their physical 13 00:00:46,300 --> 00:00:47,910 location in the world. 14 00:00:48,040 --> 00:00:55,270 So I'm going to abbreviate that as simply chords and then I'll give them a latitude and longitude property 15 00:00:55,270 --> 00:00:56,590 inside there. 16 00:00:56,590 --> 00:00:58,720 So we've got a nested object right here. 17 00:00:58,720 --> 00:01:05,090 We've got the latitude and longitude representing this person's physical location in the world now last 18 00:01:05,090 --> 00:01:11,020 thing on out this object is a method a method that will change the age of this person. 19 00:01:11,090 --> 00:01:14,630 So obviously we could do something like you know profile that age equals 20. 20 00:01:14,990 --> 00:01:19,110 Well let's make a separate function just to have a nice function to call all right. 21 00:01:19,110 --> 00:01:24,710 So one more property will add in here is set age and rather than defining this as like a function like 22 00:01:24,720 --> 00:01:30,860 so I want to try using the Yes 2015 syntax for defining a method inside insurgent object. 23 00:01:31,080 --> 00:01:32,840 So instead I'll say set age. 24 00:01:32,850 --> 00:01:38,830 I'll put my argument list in and then the function body so let's try adding in some annotation for this 25 00:01:38,830 --> 00:01:42,790 function right here using the same rules that we just learned. 26 00:01:42,790 --> 00:01:49,720 So I'm going to put in a age as an argument and then the type of this argument which will be a number 27 00:01:50,860 --> 00:01:55,320 if we're just updating this person's age I don't really expect to return anything from this function. 28 00:01:55,480 --> 00:02:01,070 So I'm going to entertain the return type is being void like so so then we can write out our implementation 29 00:02:01,070 --> 00:02:01,920 inside the function. 30 00:02:01,940 --> 00:02:05,870 We could say this dot age is age all right. 31 00:02:05,870 --> 00:02:11,330 So that's an example of a function being defined inside of an object with the function annotation on 32 00:02:11,330 --> 00:02:12,320 it. 33 00:02:12,320 --> 00:02:17,330 So let's now try doing a little bit of yes 2015 structuring and pulling some different properties out 34 00:02:17,330 --> 00:02:19,070 of this profile object. 35 00:02:19,070 --> 00:02:23,660 So for example let's try D structuring out the age property right here and figure out what the exact 36 00:02:23,660 --> 00:02:29,940 syntax for that would be so of course we could do something like const age is profile that age. 37 00:02:29,940 --> 00:02:33,510 Like I said what we want to use these structuring instead. 38 00:02:33,690 --> 00:02:40,690 So instead I'm going to write out just profile and we can do normal D structuring like so now if we 39 00:02:40,690 --> 00:02:46,630 really wanted to put a type annotation on here for some reason like maybe we fall into one of those 40 00:02:46,630 --> 00:02:52,420 three categories that we discussed earlier right here if we really wanted to put on some annotation 41 00:02:52,420 --> 00:02:58,420 directly onto the variable right here we could do so by writing out a colon and then the structure of 42 00:02:58,420 --> 00:03:05,440 the profile object so we would not just say oh this thing is going to have like age that is a number 43 00:03:05,950 --> 00:03:12,340 instead we have to list out the structure of profile any different properties that we wanted to have. 44 00:03:12,340 --> 00:03:20,760 So in this case we would put down curly braces age and no like so so notice how this seems to kind of 45 00:03:20,760 --> 00:03:26,610 like violate the rules of annotations previously when we're talking about variable annotations we had 46 00:03:26,610 --> 00:03:31,800 said well yeah we just put the type of the variable or the type of value that we're going to assign 47 00:03:31,800 --> 00:03:32,890 to this variable. 48 00:03:33,150 --> 00:03:35,220 So we're creating a variable right here called H. 49 00:03:35,220 --> 00:03:40,220 And so you might think that we only have to label it with the type that age is going to refer to. 50 00:03:40,290 --> 00:03:46,110 Which would be no that's not the case if we want to use these structuring we have to write out the expected 51 00:03:46,110 --> 00:03:48,810 structure of profile over here on the right hand side. 52 00:03:48,810 --> 00:03:54,510 So I expect this value right here to have a structure that is an object with an age property that is 53 00:03:54,510 --> 00:03:58,490 a number now to make things just a little bit more complicated. 54 00:03:58,560 --> 00:03:58,940 Let's try. 55 00:03:58,940 --> 00:04:03,100 Also D structuring out our latitude and longitude as well. 56 00:04:03,120 --> 00:04:07,220 So this is going to be some nasty stuff but I'll be some pretty good practice. 57 00:04:07,350 --> 00:04:14,600 So we would write out one set of curly braces we would say look at the court's property and then tried 58 00:04:14,600 --> 00:04:18,000 to pull out latitude and longitude out of there. 59 00:04:18,360 --> 00:04:22,770 And we want to get all that from the profile object like so okay. 60 00:04:22,800 --> 00:04:26,830 So if you're just doing plain destruction with an out in the annotation that is what it would look like 61 00:04:27,190 --> 00:04:28,890 to be just identical to the normal. 62 00:04:28,930 --> 00:04:31,060 Yes 2015 syntax. 63 00:04:31,060 --> 00:04:35,590 But once again if we fell into one these conditions where we had to put in an annotation or we would 64 00:04:35,590 --> 00:04:39,120 have to do is once again kind of mirror the object structure. 65 00:04:39,120 --> 00:04:44,430 Do we expect profile to be so it's going to be a little bit nasty here right after the deal structuring 66 00:04:44,440 --> 00:04:46,180 we can put in a colon. 67 00:04:46,180 --> 00:04:49,800 Then we'll start to describe the structure of the profile object. 68 00:04:50,060 --> 00:04:53,800 It's all put a set of curly braces I'm going to say that this thing is going to have property cords 69 00:04:54,820 --> 00:05:03,010 that's going to be an object and inside of that inner object we've got a lot property that is a no and 70 00:05:03,070 --> 00:05:08,650 an LNG property that is a number as well as a really long line so I'm going to say the file really quickly 71 00:05:08,890 --> 00:05:14,800 just to get it to reformat so you can see the whole line in total so once again kind of unexpectedly 72 00:05:14,830 --> 00:05:18,620 we do not just list out the expected type of lat and long. 73 00:05:18,730 --> 00:05:23,290 And I think this example right here will give you a better idea of why that is if we think consider 74 00:05:23,290 --> 00:05:28,960 backup here if we had only put number well what would happen if we wanted to D structure multiple properties 75 00:05:29,260 --> 00:05:35,410 and also pull out say this person's name as well which was the string if this was the case is number 76 00:05:35,410 --> 00:05:38,200 referring to the type of age or name. 77 00:05:38,200 --> 00:05:43,810 So this is why we have to kind of double up on the structure whenever we are doing the restructuring. 78 00:05:43,810 --> 00:05:48,430 So age is a number and name would be a string we have to label these type of all the different properties 79 00:05:48,640 --> 00:05:54,260 coming out of that object now in this case in this I've got a little error here around name that's really 80 00:05:54,260 --> 00:05:59,120 fine it's just because the way my project is structured chances are you see an error here as well that 81 00:05:59,120 --> 00:06:01,540 says something like name was also declared. 82 00:06:01,730 --> 00:06:06,080 If you see that totally fine you can't ignore it all right. 83 00:06:06,110 --> 00:06:06,500 That's it. 84 00:06:06,500 --> 00:06:11,090 Around objects like I said I just wanted to very quickly talk about D structuring around objects and 85 00:06:11,090 --> 00:06:16,580 what annotations for them look like and also how we talk in function declarations inside or there as 86 00:06:16,580 --> 00:06:19,020 well with some annotations. 87 00:06:19,290 --> 00:06:20,650 OK so that's pretty much it. 88 00:06:20,800 --> 00:06:24,190 On type annotations and type inference. 89 00:06:24,190 --> 00:06:29,110 So we've gone over several plain definitions win over some examples we spoke about why we care about 90 00:06:29,110 --> 00:06:33,280 these remembers because we want to make sure typescript is aware the type of all the variables we work 91 00:06:33,280 --> 00:06:38,440 with and we also discussed when we're going to use annotations and when we're going to fall back to 92 00:06:38,500 --> 00:06:45,250 inference whenever working with functions we're going to rely upon annotations 100 percent of time for 93 00:06:45,250 --> 00:06:51,010 both arguments and return types when we're working with variables we're going to rely upon type inference 94 00:06:51,070 --> 00:06:57,830 as much as we possibly can unless we are relying upon or in one of these three scenarios right here. 95 00:06:58,040 --> 00:07:01,190 All right so now we've got through a lot of this kind of boring stuff. 96 00:07:01,190 --> 00:07:05,090 Let's take a quick pause right here and continue on our next subject in the next video.