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