This course has been updated! We now recommend you take the TypeScript Fundamentals, v3 course.
Transcript from the "Intersection & Union Types" Lesson
[00:00:00]
>> Mike North: The and and or operators. So I've created two types here and one is called HasPhoneNumber, one is called HasName. They have something in common and they have something that's different, right? So think of this as a Venn diagram, right? They both have name but one has email and one has phone.
[00:00:24] So, here I've created a piece of code that basically rolls the dice, does a math.random. And half the time, it's gonna initialize it to HasPhoneNumber. Half the time, it's gonna to initialize it to HasEmail. And, in fact, TypeScript should be able to figure out, well unfortunately, that's why I left that there.
[00:00:47] It's the same type, but it just makes it ugly, right? So here, we get the nice names, HasEmail or HasPhoneNumber. We're moving that, okay, I mean, that's It's kinda accurate in a way, but like not really what I was after, and way more verbose.
>> Mike North: So note that once we have this contact info variable, we can only access name.
[00:01:21] So, think of this as if you have this sort of Venn diagram, and it could be one side or the other, we are looking at the intersection between the two. We're looking at sort of that lens. We can only access things that are guaranteed to be there. And regardless of whether this is HasName or HasPhoneNumber, name is going to be there.
[00:01:44] So that's why we can access name and only name. Union types, they use this and operator and percentage worth and. And this is saying effectively. Other contact info is both a HasEmail and also a HasPhoneNumber. So it must be initialized with everything these two shapes have. The union, this will be the full Venn diagram, both bubbles.
[00:02:15] So if we were missing one thing you would say, Property 'phone' is missing.
>> Mike North: And because we're guaranteed to have all three of these things, we can access all three of them, right? There's no ambiguity, there's no either or it's definitely both.
>> Mike North: So in this, sorry I left that there.
[00:02:45] That was an example from a previous run. So just to recap here, we covered variables. We looked at how typescript could infer the type of variable through it being initialized. We looked at arrays and tuples. Those are the ordered data structures. One, the array is arbitrary is length.
[00:03:06] The other, tuple, has a fixed length and a specific type for each element in the tuple. We looked at object types. And really the only thing you have to remember there is question mark means optional. And then finally, the equivalent of or and and in the type world, the intersection and union operators.