TypeScript Diskriminatsiyalangan Birlashmalari: Turi Xavfsiz Holat Mashinalarini Yaratish

Dasturiy ta'minotni ishlab chiqish sohasida ilovaning holatini samarali boshqarish hal qiluvchi ahamiyatga ega. Holat mashinalari murakkab holatli tizimlarni modellashtirish uchun kuchli abstraksiyani ta'minlaydi, bu esa tizimning mantiqi haqida oldindan aytib bo'ladigan xatti-harakatlarni va soddalashtirilgan mulohazalarni ta'minlaydi. TypeScript o'zining mustahkam tur tizimi bilan diskriminatsiyalangan birlashmalar (shuningdek, teglangan birlashmalar yoki algebraik ma'lumotlar turlari deb ham ataladi) yordamida turi xavfsiz holat mashinalarini yaratish uchun ajoyib mexanizmni taklif etadi.

Diskriminatsiyalangan Birlashmalar Nima?

Diskriminatsiyalangan birlashma bu bir nechta turli tiplardan biri bo'lishi mumkin bo'lgan qiymatni ifodalovchi tipdir. Ushbu tiplarning har biri, birlashma a'zolari deb nomlanadi, diskriminant yoki teg deb ataladigan umumiy, alohida xususiyatga ega. Bu diskriminant TypeScriptga birlashmaning qaysi a'zosi hozirda faol ekanligini aniq belgilashga imkon beradi, bu esa kuchli tur tekshiruvi va avtomatik to'ldirishni ta'minlaydi.

Buni svetofor kabi tasavvur qiling. U uchta holatdan birida bo'lishi mumkin: Qizil, Sariq yoki Yashil. 'rang' xususiyati diskriminant vazifasini bajaradi va bizga svetofor aynan qaysi holatda ekanligini aytib beradi.

Nima uchun Holat Mashinalari uchun Diskriminatsiyalangan Birlashmalardan Foydalanish Kerak?

Diskriminatsiyalangan birlashmalar TypeScriptda holat mashinalarini yaratishda bir qancha asosiy afzalliklarni beradi:

Tur xavfsizligi: Kompilyator barcha mumkin bo'lgan holatlar va o'tishlar to'g'ri ishlanganligini tekshirishi mumkin, bu esa kutilmagan holat o'tishlari bilan bog'liq ishlash vaqtidagi xatoliklarni oldini oladi. Bu ayniqsa katta, murakkab ilovalarda foydalidir.
Toʻliqlikni tekshirish: TypeScript kodingiz holat mashinasining barcha mumkin bo'lgan holatlarini qamrab olishini ta'minlaydi va shartli bayonot yoki switch holatida biror holat o'tkazib yuborilsa, kompilyatsiya vaqtida sizni ogohlantiradi. Bu kutilmagan xatti-harakatlarning oldini olishga yordam beradi va kodingizni yanada mustahkam qiladi.
O'qish qulayligini oshirish: Diskriminatsiyalangan birlashmalar tizimning mumkin bo'lgan holatlarini aniq belgilaydi, bu esa kodni tushunish va saqlashni osonlashtiradi. Holatlarning aniq tasvirlanishi kodning ravshanligini oshiradi.
Kengaytirilgan kodni to'ldirish: TypeScriptning intellisense funksiyasi joriy holatga asoslangan holda aqlli kodni to'ldirish takliflarini beradi, bu esa xatoliklar ehtimolini kamaytiradi va ishlab chiqishni tezlashtiradi.

Diskriminatsiyalangan Birlashmalar bilan Holat Mashinasini Aniqlash

Keling, diskriminatsiyalangan birlashmalardan foydalanib, holat mashinasini qanday aniqlashni amaliy misolda ko'rib chiqamiz: buyurtmalarni qayta ishlash tizimi. Buyurtma quyidagi holatlarda bo'lishi mumkin: Kutilmoqda, Qayta ishlanmoqda, Jo'natilgan va Yetkazib berilgan.

1-qadam: Holat Turlarini Aniqlash

Avval har bir holat uchun alohida turlarni aniqlaymiz. Har bir turda diskriminant vazifasini bajaruvchi `type` xususiyati va holatga xos bo'lgan har qanday ma'lumotlar bo'ladi.


interface Pending {
  type: "pending";
  orderId: string;
  customerName: string;
  items: string[];
}

interface Processing {
  type: "processing";
  orderId: string;
  assignedAgent: string;
}

interface Shipped {
  type: "shipped";
  orderId: string;
  trackingNumber: string;
}

interface Delivered {
  type: "delivered";
  orderId: string;
  deliveryDate: Date;
}

2-qadam: Diskriminatsiyalangan Birlashma Turini Yaratish

Keyin, bu alohida turlarni `|` (birlashma) operatori yordamida birlashtirib, diskriminatsiyalangan birlashmani yaratamiz.


type OrderState = Pending | Processing | Shipped | Delivered;

Endi `OrderState` `Pending`, `Processing`, `Shipped` yoki `Delivered` bo'lishi mumkin bo'lgan qiymatni ifodalaydi. Har bir holatdagi `type` xususiyati diskriminant vazifasini bajaradi, bu esa TypeScriptga ular orasidagi farqni aniqlash imkonini beradi.

Holat Oʻtishlarini Boshqarish

Holat mashinamizni aniqlab olganimizdan so'ng, holatlar o'rtasida o'tish mexanizmi kerak bo'ladi. Keling, joriy holat va amalni kirish sifatida qabul qilib, yangi holatni qaytaradigan `processOrder` funksiyasini yarataylik.


interface Action {
  type: string;
  payload?: any;
}

function processOrder(state: OrderState, action: Action): OrderState {
  switch (state.type) {
    case "pending":
      if (action.type === "startProcessing") {
        return {
          type: "processing",
          orderId: state.orderId,
          assignedAgent: action.payload.agentId,
        };
      }
      return state; // Holat o'zgarmaydi

    case "processing":
      if (action.type === "shipOrder") {
        return {
          type: "shipped",
          orderId: state.orderId,
          trackingNumber: action.payload.trackingNumber,
        };
      }
      return state; // Holat o'zgarmaydi

    case "shipped":
      if (action.type === "deliverOrder") {
        return {
          type: "delivered",
          orderId: state.orderId,
          deliveryDate: new Date(),
        };
      }
      return state; // Holat o'zgarmaydi

    case "delivered":
      // Buyurtma allaqachon yetkazib berilgan, keyingi amallar yo'q
      return state;

    default:
      // Bu to'liqlikni tekshirish tufayli hech qachon sodir bo'lmasligi kerak
      return state; // Yoki xatolik chiqarish
  }
}

Tushuntirish

`processOrder` funksiyasi joriy `OrderState` va `Action`ni kirish sifatida qabul qiladi.
U `state.type` diskriminantiga asoslanib joriy holatni aniqlash uchun `switch` iborasidan foydalanadi.
Har bir `case` ichida, haqiqiy o'tish boshlanganligini aniqlash uchun `action.type` ni tekshiradi.
Agar haqiqiy o'tish topilsa, u tegishli `type` va ma'lumotlar bilan yangi holat obyektini qaytaradi.
Agar haqiqiy o'tish topilmasa, u joriy holatni qaytaradi (yoki kerakli xatti-harakatga qarab xatolik chiqaradi).
`default` holati to'liqlik uchun kiritilgan va TypeScriptning to'liqlikni tekshirishi tufayli ideal holda hech qachon erishilmasligi kerak.

Toʻliqlikni tekshirishdan foydalanish

TypeScriptning to'liqlikni tekshirishi - bu holat mashinangizda barcha mumkin bo'lgan holatlarni qamrab olganingizni ta'minlaydigan kuchli xususiyatdir. Agar `OrderState` birlashmasiga yangi holat qo'shsangiz-u, `processOrder` funksiyasini yangilashni unutsangiz, TypeScript xatolikni belgilaydi.

Toʻliqlikni tekshirishni yoqish uchun `never` turidan foydalanishingiz mumkin. switch iborasining `default` holatida, holatni `never` turidagi o'zgaruvchiga tayinlang.


function processOrder(state: OrderState, action: Action): OrderState {
  switch (state.type) {
    // ... (oldingi holatlar) ...

    default:
      const _exhaustiveCheck: never = state;
      return _exhaustiveCheck; // Yoki xatolik chiqarish
  }
}

Agar `switch` iborasi barcha mumkin bo'lgan `OrderState` qiymatlarini qamrab olsa, `_exhaustiveCheck` o'zgaruvchisi `never` turida bo'ladi va kod kompilyatsiya qilinadi. Biroq, `OrderState` birlashmasiga yangi holat qo'shib, uni `switch` iborasida qamrab olishni unutsangiz, `_exhaustiveCheck` o'zgaruvchisi boshqa turda bo'ladi va TypeScript kompilyatsiya vaqtida xatolik chiqarib, sizni o'tkazib yuborilgan holat haqida ogohlantiradi.

Amaliy misollar va qo'llanmalar

Diskriminatsiyalangan birlashmalar oddiy buyurtmalarni qayta ishlash tizimlaridan tashqari keng ko'lamdagi stsenariylarda qo'llaniladi:

Foydalanuvchi interfeysi (UI) holatini boshqarish: UI komponentining holatini modellashtirish (masalan, yuklanmoqda, muvaffaqiyatli, xatolik).
Tarmoq so'rovlarini qayta ishlash: Tarmoq so'rovining turli bosqichlarini ifodalash (masalan, boshlang'ich, jarayonda, muvaffaqiyatli, muvaffaqiyatsiz).
Forma tekshiruvi: Forma maydonlarining to'g'riligini va umumiy forma holatini kuzatish.
Oʻyin ishlab chiqish: O'yin qahramoni yoki obyektining turli holatlarini aniqlash.
Autentifikatsiya oqimlari: Foydalanuvchi autentifikatsiya holatlarini boshqarish (masalan, tizimga kirgan, tizimdan chiqqan, tekshiruv kutilmoqda).

Misol: UI holatini boshqarish

Keling, APIdan ma'lumotlarni oladigan UI komponentining holatini boshqarishning oddiy misolini ko'rib chiqaylik. Biz quyidagi holatlarni aniqlashimiz mumkin:


interface Initial {
  type: "initial";
}

interface Loading {
  type: "loading";
}

interface Success {
  type: "success";
  data: T;
}

interface Error {
  type: "error";
  message: string;
}

type UIState = Initial | Loading | Success | Error;

function renderUI(state: UIState): React.ReactNode {
  switch (state.type) {
    case "initial":
      return Ma'lumotlarni yuklash uchun tugmani bosing.;
    case "loading":
      return Yuklanmoqda...;
    case "success":
      return {JSON.stringify(state.data, null, 2)};
    case "error":
      return Xatolik: {state.message};
    default:
      const _exhaustiveCheck: never = state;
      return _exhaustiveCheck;
  }
}

Bu misol, diskriminatsiyalangan birlashmalardan UI komponentining turli holatlarini samarali boshqarish uchun qanday foydalanish mumkinligini ko'rsatadi, bu esa UI ning joriy holatga qarab to'g'ri ko'rsatilishini ta'minlaydi. `renderUI` funksiyasi har bir holatni mos ravishda boshqaradi, bu esa UIni boshqarishning aniq va tur xavfsiz usulini ta'minlaydi.

Diskriminatsiyalangan Birlashmalardan Foydalanish bo'yicha Eng Yaxshi Amaliyotlar

TypeScript loyihalaringizda diskriminatsiyalangan birlashmalardan samarali foydalanish uchun quyidagi eng yaxshi amaliyotlarni ko'rib chiqing:

Mazmunli Diskriminant Nomlarini Tanlang: Xususiyatning maqsadini aniq ko'rsatadigan diskriminant nomlarini tanlang (masalan, `type`, `state`, `status`).
Holat Ma'lumotlarini Minimal Darajada Saqlang: Har bir holat faqat o'sha holatga tegishli ma'lumotlarni o'z ichiga olishi kerak. Holatlarda keraksiz ma'lumotlarni saqlashdan saqlaning.
Toʻliqlikni tekshirishdan foydalaning: Barcha mumkin bo'lgan holatlarni qamrab olganingizga ishonch hosil qilish uchun har doim to'liqlikni tekshirishni yoqing.
Holat Boshqaruvi Kutubxonasidan Foydalanishni Ko'rib Chiqing: Murakkab holat mashinalari uchun XState kabi maxsus holat boshqaruvi kutubxonasidan foydalanishni ko'rib chiqing, u holat jadvallari, ierarxik holatlar va parallel holatlar kabi ilg'or xususiyatlarni taqdim etadi. Biroq, oddiyroq stsenariylar uchun diskriminatsiyalangan birlashmalar yetarli bo'lishi mumkin.
Holat Mashinangizni Hujjatlashtiring: Saqlash qulayligini va hamkorlikni yaxshilash uchun holat mashinangizning turli holatlarini, o'tishlarini va amallarini aniq hujjatlashtiring.

Ilg'or Texnikalar

Shartli Turlar

Shartli turlarni diskriminatsiyalangan birlashmalar bilan birlashtirib, yanada kuchliroq va moslashuvchan holat mashinalarini yaratish mumkin. Masalan, joriy holatga qarab funksiya uchun turli qaytarish turlarini aniqlash uchun shartli turlardan foydalanishingiz mumkin.


function getData(state: UIState): T | undefined {
  if (state.type === "success") {
    return state.data;
  }
  return undefined;
}

Bu funksiya oddiy `if` iborasidan foydalanadi, lekin ma'lum bir turni doimo qaytarishini ta'minlash uchun shartli turlar yordamida yanada mustahkamroq qilish mumkin.

Yordamchi Turlar

TypeScriptning `Extract` va `Omit` kabi yordamchi turlari diskriminatsiyalangan birlashmalar bilan ishlashda foydali bo'lishi mumkin. `Extract` sizga shart asosida birlashma turidan ma'lum a'zolarni ajratib olishga imkon beradi, `Omit` esa turdan xususiyatlarni olib tashlashga imkon beradi.


// UIState birlashmasidan "success" holatini ajratib olish
type SuccessState = Extract, { type: "success" }>;

// Error interfeysidan 'message' xususiyatini olib tashlash
type ErrorWithoutMessage = Omit;

Turli Sanoatlardagi Haqiqiy Hayot Misollari

Diskriminatsiyalangan birlashmalarning kuchi turli sohalar va dasturiy ilovalar bo'ylab kengayadi:

Elektron Tijorat (Global): Global elektron tijorat platformasida buyurtma holati diskriminatsiyalangan birlashmalar bilan ifodalanishi mumkin, bu "To'lov Kutilmoqda", "Qayta Ishlanmoqda", "Jo'natilgan", "Yo'lda", "Yetkazib Berilgan" va "Bekor Qilingan" kabi holatlarni boshqaradi. Bu turli xil yuk tashish logistikasiga ega bo'lgan turli mamlakatlarda to'g'ri kuzatuv va aloqani ta'minlaydi.
Moliyaviy Xizmatlar (Xalqaro Bankchilik): "Avtorizatsiya Kutilmoqda", "Avtorizatsiyalangan", "Qayta Ishlanmoqda", "Bajarilgan", "Muvaffaqiyatsiz" kabi tranzaksiya holatlarini boshqarish juda muhimdir. Diskriminatsiyalangan birlashmalar ushbu holatlarni boshqarishning mustahkam usulini taqdim etadi va turli xalqaro bank qoidalariga rioya qiladi.
Sogʻliqni saqlash (Masofadan Bemorlarni Kuzatish): Bemorning sog'lig'i holatini "Normal", "Ogohlantirish", "Kritik" kabi holatlar yordamida ifodalash o'z vaqtida aralashuvni ta'minlaydi. Global tarqalgan sog'liqni saqlash tizimlarida diskriminatsiyalangan birlashmalar joylashuvdan qat'i nazar ma'lumotlarning izchil talqin qilinishini ta'minlaydi.
Logistika (Global Ta'minot Zanjiri): Xalqaro chegaralar orqali yuk holatini kuzatish murakkab ish oqimlarini o'z ichiga oladi. "Bojxona Rasmiylashtiruvi", "Yo'lda", "Tarqatish Markazida", "Yetkazib Berilgan" kabi holatlar diskriminatsiyalangan birlashma bilan amalga oshirish uchun juda mos keladi.
Ta'lim (Onlayn O'quv Platformalari): Kursga yozilish holatini "Ro'yxatdan O'tgan", "Jarayonda", "Tugatilgan", "Chiqib Ketgan" kabi holatlar bilan boshqarish butun dunyodagi turli ta'lim tizimlariga moslashtirilgan soddalashtirilgan o'quv tajribasini ta'minlay oladi.

Xulosa

TypeScript diskriminatsiyalangan birlashmalari holat mashinalarini yaratishning kuchli va tur xavfsiz usulini taqdim etadi. Mumkin bo'lgan holatlar va o'tishlarni aniq belgilab, siz yanada mustahkam, saqlanuvchan va tushunarli kod yaratishingiz mumkin. Tur xavfsizligi, to'liqlikni tekshirish va kengaytirilgan kodni to'ldirishning birikmasi diskriminatsiyalangan birlashmalarni murakkab holat boshqaruvi bilan shug'ullanadigan har qanday TypeScript dasturchisi uchun bebaho vositaga aylantiradi. Keyingi loyihangizda diskriminatsiyalangan birlashmalarni qo'llang va tur xavfsiz holat boshqaruvining afzalliklarini o'zingiz his qiling. Elektron tijoratdan sog'liqni saqlashgacha, logistikadan ta'limgacha bo'lgan turli misollar bilan ko'rsatganimizdek, diskriminatsiyalangan birlashmalar orqali tur xavfsiz holat boshqaruvi printsipi universal qo'llaniladi.

Siz oddiy UI komponentini yoki murakkab korporativ ilovani yaratayotgan bo'lsangiz ham, diskriminatsiyalangan birlashmalar sizga holatni samaraliroq boshqarishga va ish vaqtidagi xatolar xavfini kamaytirishga yordam beradi. Shunday qilib, TypeScript bilan tur xavfsiz holat mashinalari dunyosiga sho'ng'ing va o'rganing!