Union ба Intersection төрлүүд

Бид нэг хувьсагч зөвхөн нэг тогтмол төрлийг агуулдгийг судаллаа. Гэхдээ бодит код дотор нэг зүйл хоёр өөр хэлбэрт байж болдог. Жишээ нь функц string эсвэл number авах, эсвэл хоёр объектын бүх шинж чанарыг нэгтгэх. Энэ хичээлд TypeScript-ийн хамгийн хэрэглэгддэг хоёр техникийг судална.

Union төрөл — "эсвэл"

Union нь нэг хувьсагч хэд хэдэн өөр төрлийн аль нэгийг авч болно гэдгийг илэрхийлнэ. | тэмдэглэгээг ашиглана.

let утга: string | number;

утга = "Сайн уу"; // зөв
утга = 42; // зөв
утга = true; // Алдаа! boolean байж болохгүй

string | number гэдгийг "string эсвэл number" гэж уншина.

Union функцэд

function форматлах(оролт: string | number): string {
  if (typeof оролт === "string") {
    return оролт.toUpperCase();
  }
  return оролт.toFixed(2);
}

console.log(форматлах("болд")); // "БОЛД"
console.log(форматлах(3.14159)); // "3.14"

typeof ашиглан төрлийг шалгасны дараа TypeScript тухайн блок дотор яг ямар төрөл байгааг мэддэг болдог. Үүнийг type narrowing гэнэ — TypeScript аль ч замд юу байгааг мэдэж, зөв аргуудыг санал болгоно.

Утгуудын Union

Union зөвхөн төрлүүд биш, тодорхой утгуудын хооронд ч хэрэглэж болно:

type Чиглэл = "зүүн" | "баруун" | "дээш" | "доош";

function явах(чиглэл: Чиглэл): void {
  console.log(`${чиглэл} тийш явна`);
}

явах("зүүн"); // зөв
явах("баруун"); // зөв
явах("хойш"); // Алдаа! "хойш" гэх сонголт байхгүй

Энэ нь enum-тэй төстэй боловч хамаагүй товч бичиглэлтэй. Сонголтын тоо цөөн байвал ийм хэлбэр нь илүү хялбар.

Intersection төрөл — "ба"

Intersection нь хоёр ба түүнээс дээш төрлийн бүх шинж чанарыг нэгтгэнэ. & тэмдэглэгээг ашиглана.

type Хүн = {
  нэр: string;
  нас: number;
};

type Ажилтан = {
  компани: string;
  цалин: number;
};

type ХүнАжилтан = Хүн & Ажилтан;

const ажилтан: ХүнАжилтан = {
  нэр: "Сарнай",
  нас: 30,
  компани: "Монгол Компани",
  цалин: 2_500_000,
};

Хүн & Ажилтан гэдгийг "Хүн ба Ажилтан" гэж уншина. Нэгтгэгдсэн төрлийн бүх шинж чанарыг заавал оруулах ёстой — нэг нь дутуу байвал TypeScript алдаа заана.

Intersection бодит жишээ

Вэб апп дотор нийтлэг хэв маягийг intersection ашиглан нэгтгэдэг:

type Timestamp = {
  үүссэн огноо: string;
  шинэчлэгдсэн огноо: string;
};

type Хичээл = {
  гарчиг: string;
  агуулга: string;
  зохиогч: string;
};

type БүрэнХичээл = Хичээл & Timestamp;

const хичээл: БүрэнХичээл = {
  гарчиг: "TypeScript үндэс",
  агуулга: "...",
  зохиогч: "Болд",
  үүссэн огноо: "2024-01-15",
  шинэчлэгдсэн огноо: "2024-03-20",
};

Timestamp-г тусад нь тодорхойлсноор хэд хэдэн өөр төрлүүдэд дахин ашиглаж болно.

Union ба Intersection харьцуулалт

type А = { x: number };
type В = { y: string };

// Union: A эсвэл B-ийн аль нэг — зөвхөн хоёуланд нь байгаа зүйлийг ашиглаж болно
type АэсвэлВ = А | В;
const утга1: АэсвэлВ = { x: 1 }; // зөв
const утга2: АэсвэлВ = { y: "мөр" }; // зөв

// Intersection: A ба B хоёулаа — хоёулангийнх нь бүх зүйлийг ашиглаж болно
type АбаВ = А & В;
const утга3: АбаВ = { x: 1, y: "мөр" }; // зөв
const утга4: АбаВ = { x: 1 }; // Алдаа! y дутуу

| Тэмдэглэгээ | Нэр | Утга | Хэрэглэгдэх газар | | ----------- | ------------ | ------------------ | ------------------------------- | | A \| B | Union | A эсвэл B | Олон төрлийн оролт, сонголт | | A & B | Intersection | A ба B хоёулаа | Объектуудыг нэгтгэх, шинж нэмэх |

Дараагийн хичээлд:

TypeScript-д Type Alias ашиглан өөрийн төрлийг хэрхэн нэрлэж, кодоо уншихад хялбар болгохыг судална.