Check out a free preview of the full TypeScript 5+ Fundamentals, v4 course

The "Intersection Types" Lesson is part of the full, TypeScript 5+ Fundamentals, v4 course featured in this preview video. Here's what you'd learn in this lesson:

Mike discusses intersection types and how they are different from union types. Intersection types are very picky in terms of what values they accept, but they can be used in various contexts where the behavior of both types is required.

Preview
Close

Transcript from the "Intersection Types" Lesson

[00:00:00]
>> So we talked conceptually about intersection types a bit earlier. We regard it as sort of end, but for types. So, let's apply similar to how we probe that the union type. Let's look at what kinds of values an intersection type accepts and then what the resultant intersection type can be used as.

[00:00:31]
So here, if you recall when we go back to our union type example, union types accepted just about all the examples we had, it wouldn't accept like a string. But any number that's either even, or one through five, it'll accept. Look how picky this intersection type is. It won't accept an even and low number.

[00:00:56]
Sorry, it won't accept 6, because six is not a low number. It's not in one through five. It won't accept three because it's not even. It'll accept four or two, and that's it. So it's very, very picky in terms of what it accepts. But if we look at how it can be used, all of these functions are very happy to take the intersection type as an argument, right?

[00:01:24]
This is two or four, it's guaranteed to be even, and a low number. It's guaranteed to be an even number that is also under five. And of course it's a number. And if we look back up to our union type example, look at all these that failed, right?

[00:01:40]
And it's because a union type is so accepting. There's always a member in the set, for these three, that causes TypeScript to object, right? Here it's not happy with the number one. Here it's not happy with the number six. Here it's also not happy with the number six.

[00:01:57]
Okay, so there's sort of, there's a little bit of interesting asymmetry here. So what intersection types are it means that is it's everything that is in both sets, in this case, the numbers two and four. And because of that we can use any of the behavior that's present In either set, meaning if there are methods on either set we have access to all of those methods in terms of where we can use this value.

[00:02:26]
It can sub in for an even number or for a number one through five, it kind of makes everything happy there. So when I say there's some asymmetry, I mean this in terms of values allowed in the set, a union type on the left, very accepting. Anything can join the set.

[00:02:48]
Anything can join the union and as long as it's in one of the two sets. The requirements that all members meet, you could think of that as very small. We can only assume that it's I guess a number lower than ten. It can't stand in for an even cuz it's not guaranteed to be even.

[00:03:08]
It can't stand in for one through five cuz well, it's not guaranteed to be one through five. And on the other side, we have a very picky intersection type. But in terms of the requirements that all members meet, it's everything. Meaning it's an even number, it is a number one through five, it can it can be used, going back to this example here.

[00:03:34]
It can be passed into all of these functions. So that's what I mean by asymmetry. They're sort of like what values can it hold versus what guarantees do we have about any given member of the resultant type. I already mentioned here I say 50 to one earlier I said 100 to one.

[00:03:52]
It's in application code it is very, very rare to see intersection types. You'll see union types all over the place because of control flow to places where intersection types will appear. It's object.assign and the equivalent object spread, where you're literally merging two objects together. Those are places where you may not explicitly end up writing an intersection type, but it's happening behind the scenes.

[00:04:21]
You're getting kind of the merged two things together.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now