ชนิดยูเนียน: A หรือ B

เริ่มต้นใช้งาน

ไวยากรณ์ยูเนียนพื้นฐาน

let id: string | number;
id = 'abc123'; // OK
id = 42;       // OK
// id = true;  // Error

ยูเนียนในพารามิเตอร์ฟังก์ชัน

function format(val: string | number): string {
  return typeof val === 'string' ? val.toUpperCase() : val.toFixed(2);
}

ต้องจำกัดประเภทสมาชิกยูเนียน

function process(val: string | number) {
  // val.toFixed(2); // Error — not on string
  if (typeof val === 'number') {
    val.toFixed(2); // OK
  }
}

ยูเนียนกับประเภทลิเทอรัล

type Direction = 'north' | 'south' | 'east' | 'west';
type StatusCode = 200 | 201 | 400 | 404 | 500;

ยูเนียนสำหรับประเภทที่อาจว่างเปล่า

function getUser(id: number): User | null {
  return db.find(u => u.id === id) ?? null;
}

ยูเนียนของประเภทอ็อบเจ็กต์

type Cat = { kind: 'cat'; meow(): void };
type Dog = { kind: 'dog'; bark(): void };
type Pet = Cat | Dog;
function speak(pet: Pet) {
  if (pet.kind === 'cat') pet.meow();
  else pet.bark();
}

ยูเนียนที่มีสามประเภทขึ้นไป

type Input = string | number | boolean | null;

ยูเนียนในประเภทค่าที่ส่งกลับ

function divide(a: number, b: number): number | null {
  if (b === 0) return null;
  return a / b;
}

ยูเนียนแบบมีตัวจำแนก

type Square = { kind: 'square'; side: number };
type Circle = { kind: 'circle'; radius: number };
type Shape = Square | Circle;

คุณสมบัติร่วมกันโดยไม่ต้องจำกัดประเภท

type A = { name: string; x: number };
type B = { name: string; y: number };
type AB = A | B;
function getName(obj: AB): string {
  return obj.name; // OK — name is on both
}

ตรวจสอบความเข้าใจอย่างรวดเร็ว

ทบทวน