Typescript Foundations / Advanced Types

Intersecting Types

An Intersection Type combines multiple types into one. The resulting type will have all properties from each type.

✅ Syntax

type A = { name: string };
type B = { age: number };
type Person = A & B;
const user: Person = {
	name: "Tisha",
	age: 22
};

This Person must have both name and age.

🔍 Use Case: Combining Object Types

type HasEmail = { email: string };
type HasPhone = { phone: string };
type ContactInfo = HasEmail & HasPhone;
const contact: ContactInfo = {
	email: "test@example.com",
	phone: "1234567890"
};

🧠 Intersection vs Union

Feature

Union (|)  

Intersection (&)   

Meaning

Either type A or type B 

Must satisfy both type A and B

Usage

When value can be of either type

When value must have all properties

Real example

"success" I "error" (status flags)  

{name} & {email} (merged props)

🔒 With Interfaces

interface Admin {
	role: string;
}

interface User {
	name: string;
}

type AdminUser = Admin & User;
const admin: AdminUser = {
	name: "Riya",
	role: "Super Admin"
};

⚠️ Conflicting Properties

Be cautious: if the same property exists in both types but with different types, you’ll get an error.

type A = { id: number };
type B = { id: string };
type C = A & B;  // ❌ Error: Conflicting types for `id`

✅ Combining with Functions

You can intersect function types to create overloaded functions:

type Loggable = {
	log: () => void;
};

type Printable = {
	print: () => void;
};

type LoggerPrinter = Loggable & Printable;
const item: LoggerPrinter = {
	log() {
		console.log("Logging...");
	},
	print() {
		console.log("Printing...");
	}
};

🎯 Practical Use Case: Props Composition in React (for frontend devs)

✅ Summary

Term

Meaning

A & B

Must have all properties from both A and B

Good for

Combining types, mixins, complex prop objects

Caution

Avoid name conflicts with different types