1. The Core Idea

• Union type (|) → OR relationship

  “A value can be this OR that.”

• Intersection type (&) → AND relationship

  “A value must satisfy this AND that at the same time.”

That’s the essence — but let’s go deeper because behavior changes depending on how you use them.

🎯 2. Union Types — “Either this or that”

A union type allows a variable to hold one of multiple possible types.

✅ Example 1: Simple Union

let id: string | number;

id = "abc123"; // ✅ okay
id = 101;      // ✅ okay
id = true;     // ❌ error

🧠 Meaning → id can either be a string OR a number, not both at once.

✅ Example 2: With Functions

function printId(id: string | number) {
  if (typeof id === "string") {
    console.log(id.toUpperCase()); // ✅ safe
  } else {
    console.log(id.toFixed(2)); // ✅ safe
  }
}

Here TypeScript forces you to narrow down the type before you use it.

That’s called Type Narrowing — a key TS feature.

✅ Example 3: With Interfaces

interface User {
  name: string;
}

interface Admin {
  admin: boolean;
}

function getDetails(person: User | Admin) {
  // You can only access common properties
  // person.name ❌ (not allowed — because Admin might not have 'name')
  // person.admin ❌ (not allowed — because User might not have 'admin')

  // You must narrow type first:
  if ("name" in person) {
    console.log("User:", person.name);
  } else {
    console.log("Admin:", person.admin);
  }
}

🧩 Important point:

Union narrows access — you can only use common members until you check which one it actually is.