Partial Types, Pick, & Omit

[00:00:00]
>> Anjana Vakil: Let's look at another one that's maybe more useful, and that is partial I'm going to copy this into our lovely lovely playground OK So we have a user It has two properties, username and ID, and both of those are required Right, so if I were to, let's say, pass in—I have a variable that I'm saying is type user, and I try to assign it to something that doesn't have an ID, it complains

[00:00:42]
We've seen this before, right Where's that property you told me was required Required in type user Now we saw before that we could put a question mark here to make that an optional property, and then this is OK However, we also have a utility type partial where it's going to sort of do that question marking for us on all of the properties

[00:01:18]
So if I add more properties here and I wanted them all to be optional, I would have to keep typing out question mark, question mark, question mark And there might be cases where, like, no, I want this to be a real user with all of its properties, like this here But maybe I want something like updated user info where somebody—I don't know—here, email is a more likely property on a user object, where somebody changed their email to like new at email.com as opposed to, let's say, old at email.com

[00:02:07]
And this is a thing that we'll see All right, no ID OK, so this user has this email, and let's say I want to—maybe I'm passing around like in a form or something, I want to say, hey, all right, maybe there's some values of this user that they want to change, like their email They can't change their ID, for example, but maybe they can change their email

[00:02:35]
We can assign a—we can wrap our user type in this partial utility type And what that does is the same thing, analogous to how read-only added—essentially it's like it added read-only in front of every property Partial is essentially doing a question mark after every property and saying, hey, this could be any partial amount of data that makes up the user object

[00:03:13]
So let me undo that But so if I try to—yeah, so if I can even omit the entire data itself, that's valid because all of those properties are now optional in the partial type However, I still know what a user is This is still not just any old object This is still a user or some partial subset of a user It does not allow for other properties like invalid, which does not exist in this type, because partial user knows about the same properties that user does

[00:03:53]
It's just that they're all optional So this is something that you might see around Talk about it a little bit later And just a couple of others real quick We have two types that are sort of related One is called pick, and one is called omit OK, so partial made all of the properties optional Read-only made all of the properties read-only

[00:04:37]
We had this type pick, which is essentially going to only pick out certain properties or certain subtypes, I guess you could say, of this type So in this case, if I have—if I want to get a type that is the ID type from human but no other types from human—and so it has like if human looks like this, where there's a username and an ID and a full name, if I pick just one property from my human type, what I get is a type that understands it should only have that one property within the object

[00:05:42]
And so this is saying it's kind of like a more specific subset of the type If partial is just like any subset of this type, any of the properties will do, pick is saying, no, no, no, exactly this property Or if we pass in a union type, it's going to say, OK, now I have a type that is like a subtype of human that only has those two properties

[00:06:21]
So what we're seeing here now is an example of a parameterized type, a generic type that takes in two parameters instead of just one And that comma, just like in function arguments, is separating them It's just that instead of a type like number for user, we're actually passing in an actual key of this type, which is similar to like a key of an object

[00:06:50]
It's just that TypeScript cares if the key doesn't exist, and JavaScript does not But so what we're doing here is we're starting to work with types that take in lots of parameters Two is lots for us right now, but you will ultimately see types, especially if you're hovering over types from libraries that are like massive projects

[00:07:08]
You'll see like big angle bracket signatures with multiple things However, they can get pretty unwieldy, so this is not—this is more to understand what's going on when we read this It's not necessarily something you'll be writing all the time, but suffice it to say that what we do here is we say, here's the type that I want to pick properties from, and then we provide a type or union type of keys to that object

[00:07:48]
So if I say, let's say, not a thing, TypeScript will complain because, hey, you were trying to pick a property from this interface that doesn't exist, so what you doing And it's a little bit out of scope for us to understand exactly how TypeScript is doing all these calculations, but I think as we start working through this, it'll become kind of more intuitive how TypeScript is passing type information through all of these types, like these angle bracket parameterized types, in the same way that we pass data to functions as arguments, and then it gets passed down to other functions and other functions and other functions

[00:08:31]
So types can have parameters, just like functions do If we, let's say, create a type where we're picking just the full name, but then we try to give it the ID, it's going to say, no, no, no, you said that this picked type was much smaller and didn't have an ID, so what you doing, Anjana, honestly Similarly to pick, there is also omit, which is kind of the opposite, and hopefully it's intuitive that the syntax is sort of the same

[00:09:07]
It's just that it's going to omit whatever keys we pass it instead of including them So similarly, if I omit username from human, I get the type with everything except username And likewise, if I pass in a union of keys here, I get a type with whatever's left over And this is—like in our case, because we have three properties here, omitting two of them is the same thing as picking the other one

[00:09:45]
So these are kind of analogs Now I introduce all of this mostly again to cover or sort of give examples of type parameters and generic types So we could say generic types are the ones that are declared with these angle brackets and then some kind of parameter that's representing a type we don't know about yet And so usually you'll see that in the definition or in the type hints as like a T or a different letter, but often a T