Union vs intersection mental model in Typescript - Performance Comparison
When working with union and intersection types in TypeScript, it's helpful to understand how the operations scale as we combine types.
We want to see how the complexity grows when checking or combining these types.
Analyze the time complexity of the following type checks using union and intersection.
type A = { a: number };
type B = { b: string };
type C = A | B; // union
type D = A & B; // intersection
function checkUnion(x: C) {
if ('a' in x) return x.a;
else return x.b;
}
function checkIntersection(x: D) {
return x.a + x.b.length;
}
This code defines union and intersection types and shows how we access their properties.
Look at how many checks or property accesses happen when using union or intersection types.
- Primary operation: Property existence checks for union, direct property access for intersection.
- How many times: For union, one check per type to decide type; for intersection, all properties accessed directly.
As the number of types combined grows, the checks or accesses increase.
| Input Size (number of types) | Approx. Operations |
|---|---|
| 2 | 2 checks or accesses |
| 5 | 5 checks or accesses |
| 10 | 10 checks or accesses |
Pattern observation: The number of operations grows linearly with the number of types combined.
Time Complexity: O(n)
This means the time to check or access properties grows in direct proportion to the number of types involved.
[X] Wrong: "Union and intersection types have constant time checks regardless of size."
[OK] Correct: Each additional type adds more properties to check or access, so the work grows with the number of types.
Understanding how combining types affects checking helps you reason about code performance and type safety in real projects.
"What if we nested unions inside intersections? How would that affect the time complexity?"
Practice
union type in TypeScript?Solution
Step 1: Understand union type meaning
A union type means a value can be one of several types, for example,string | numbermeans the value can be either a string or a number.Step 2: Compare with intersection type
An intersection type requires a value to have all combined types, which is different from union. So a value can be one type or another, likestring | number, correctly describes union.Final Answer:
A value can be one type or another, likestring | number. -> Option BQuick Check:
Union = one of multiple types [OK]
- Confusing union with intersection
- Thinking union requires all types simultaneously
- Mixing up syntax symbols | and &
A and B?Solution
Step 1: Recall intersection syntax
Intersection types use the ampersand&symbol to combine types, meaning the value must satisfy both types.Step 2: Identify correct syntax
type C = A & B;usesA & B, which is the correct syntax for intersection types in TypeScript.Final Answer:
type C = A & B; -> Option DQuick Check:
Intersection uses & symbol [OK]
- Using | instead of & for intersection
- Using invalid operators like + or comma
- Confusing type alias syntax
value after this assignment?type A = { name: string };
type B = { age: number };
let value: A | B = { name: "Alice", age: 30 };Solution
Step 1: Understand union type assignment
The variablevalueis declared asA | B, meaning it can be either type A or type B.Step 2: Check assigned object
The assigned object has bothnameandageproperties, which does not strictly satisfy either A or B alone, so it is not valid as a union type.Final Answer:
Error: value must be either A or B, not both. -> Option AQuick Check:
Union requires value to match one type exactly [OK]
- Thinking union allows objects with all properties combined
- Confusing union with intersection requirements
- Assuming extra properties are allowed in union
type A = { name: string };
type B = { age: number };
let person: A & B = { name: "Bob" };Solution
Step 1: Understand intersection type requirements
An intersection typeA & Brequires the value to have all properties from both types A and B.Step 2: Check assigned object properties
The object assigned has onlynameproperty but is missingage, so it does not satisfy the intersection type.Final Answer:
Missing propertyagein the object assigned toperson. -> Option CQuick Check:
Intersection requires all properties present [OK]
- Thinking intersection allows partial properties
- Confusing union and intersection requirements
- Ignoring missing properties error
type Name = { name: string };
type Age = { age: number };
type Contact = { email: string };
// Which type correctly represents a value that must have a name and either age or email?
// Choose the correct type for Person:Solution
Step 1: Analyze requirement
The value must have anameproperty and either anageoremailproperty.Step 2: Translate to types
This means the type must beNameAND (eitherAgeORContact), which isName & (Age | Contact).Step 3: Check options
type Person = Name & (Age | Contact);matches this exactly. Other options either change the logic or require all three properties.Final Answer:
type Person = Name & (Age | Contact); -> Option AQuick Check:
Name AND (Age OR Contact) = Name & (Age | Contact) [OK]
- Ignoring parentheses changing logic
- Mixing order of union and intersection
- Choosing all properties instead of either/or
Ready to prove it?
Pass the test and this pattern moves unknown
