သတိထားရမည့် အမှားများ & Best Practices

💡 ရည်ရွယ်ချက်

ရှုပ်ထွေးတဲ့ Types တွေ (Advanced Types) နဲ့ အလုပ်လုပ်တဲ့အခါမှာ ကြုံတွေ့ရလေ့ရှိတဲ့ အမှားတွေနဲ့၊ ရှောင်ကြဉ်သင့်တဲ့ အချက်တွေ၊ ပြီးတော့ Code တွေကို ပိုမို ကောင်းမွန်အောင် ဘယ်လို ရေးသားသင့်သလဲ (Best Practices) ဆိုတာတွေကို ဆွေးနွေးသွားပါမယ်۔ ရှုပ်ထွေးတဲ့ Types တွေ (Advanced Types) နဲ့ အလုပ်လုပ်တဲ့အခါမှာ ကြုံတွေ့ရလေ့ရှိတဲ့ အမှားတွေနဲ့၊ ရှောင်ကြဉ်သင့်တဲ့ အချက်တွေ၊ ပြီးတော့ Code တွေကို ပိုမို ကောင်းမွန်အောင် ဘယ်လို ရေးသားသင့်သလဲ (Best Practices) ဆိုတာတွေကို ဆွေးနွေးသွားပါမယ်။

၁။ အရမ်းရှုပ်ထွေးတဲ့ Generics များ အသုံးပြုခြင်း

• အမှား: Generics တွေကို အသုံးပြုတဲ့အခါ တစ်ခါတလေမှာ အရမ်း နက်ရှိုင်းပြီး ရှုပ်ထွေးသွားတတ်ပါတယ်။ ဥပမာ - ProcessResult ကဲ့သို့သော ရှုပ်ထွေးသည့် Generics များ ရေးမိရင် အခြားသူတွေ ဖတ်ဖို့ ခက်ခဲသလို၊ ကိုယ်တိုင် ပြန်ဖတ်ရင်တောင် နားလည်ဖို့နဲ့ Error ရှာဖို့ အရမ်း ခက်ခဲစေပါတယ်။
• အကောင်းဆုံး လုပ်ဆောင်ရမည့် နည်းလမ်း (Best Practices):
  • Type Parameters (Generics ဥပမာ - T, U) တွေကို နာမည်ပေးတဲ့အခါ ဘာကို ဆိုလိုသလဲဆိုတာ ရှင်းရှင်းလင်းလင်း သိသာအောင် နာမည်ပေးပါ။ (ဥပမာ - ရိုးရိုး T, U, V လို့ ပေးမယ့်အစား TResponse, TError, TItem စသဖြင့် အဓိပ္ပာယ်ရှိတဲ့ နာမည်မျိုး ပေးပါ)။
  • အရမ်း ရှုပ်ထွေးနေတဲ့ Generic Types အကြီးကြီးတွေကို အပိုင်းလေးတွေ ခွဲပြီး၊ ကြားခံ Helper Types တွေအဖြစ် သီးသန့် ခွဲထုတ် ရေးသားပါ။
  • ကိုယ်ရေးထားတဲ့ Generic Types တွေက ဘာကို ရည်ရွယ်တာလဲ၊ ဘယ်လို ကန့်သတ်ချက် (Constraints) တွေ ရှိသလဲဆိုတာကို Comments တွေနဲ့ သေချာ ရှင်းပြထားပါ။
  • တစ်ခါတလေမှာ အရမ်း Generic ဆန်ဆန် (အကုန်လုံးနဲ့ အဆင်ပြေအောင်) ရေးတာထက်၊ ဖတ်လို့ ပိုလွယ်ပြီး ရိုးရှင်းတဲ့ နည်းလမ်းကို ရွေးချယ်တာက ပိုကောင်းနိုင်ပါတယ်။

၂။ အသေးစိတ် အချက်အလက်တွေ (Specificity) မသိလိုက်ဘဲ ပျောက်ဆုံးသွားခြင်း

• အမှား: ကိုယ် တည်ဆောက်ထားတဲ့ Object တွေမှာ ပါဝင်တဲ့ အသေးစိတ် အချက်အလက် (ဥပမာ - တိကျတဲ့ Key နာမည်တွေ) ကို မသိလိုက်ဘဲ၊ Type Annotation (:) သုံးပြီး ပိုကျယ်ပြန့်တဲ့ Type (Widened Type) ကြီးနဲ့ သွားသတ်မှတ်မိတာမျိုးပါ။
• အကောင်းဆုံး လုပ်ဆောင်ရမည့် နည်းလမ်း:
  • satisfies Operator ကို အသုံးပြုပါ။ ဒါမှသာ သင်သတ်မှတ်ထားတဲ့ စည်းမျဉ်း (Type) နဲ့ ကိုက်ညီမှု ရှိ/မရှိ စစ်ဆေးရင်းနဲ့၊ တစ်ချိန်တည်းမှာပဲ မူရင်း Object ရဲ့ အသေးစိတ် အချက်အလက်တွေကိုပါ မပျောက်ပျက်ဘဲ ဆက်လက် ထိန်းသိမ်းထားနိုင်မှာ ဖြစ်ပါတယ်။

၃။ any ကို အလွယ်တကူ အသုံးပြုခြင်း

• အမှား: Types တွေ ရှုပ်ထွေးလာတဲ့အခါ ဒါမှမဟုတ် Error တွေ ရှင်းရတာ ခက်လာတဲ့အခါ၊ TypeScript Compiler ရဲ့ Error တွေကို အမြန် ပိတ်ချင်လို့ any ကို အလွယ်တကူ သုံးမိတတ်ပါတယ်။ ဒါဟာ TypeScript ရဲ့ အဓိက အကျိုးကျေးဇူးဖြစ်တဲ့ Type Safety (Type မှန်ကန်မှု အာမခံချက်) ကို အလွယ်တကူ စွန့်လွှတ်လိုက်တာနဲ့ တူပါတယ်။
• အကောင်းဆုံး လုပ်ဆောင်ရမည့် နည်းလမ်း:
  • အတတ်နိုင်ဆုံး Types တွေကို တိတိကျကျ မှန်ကန်အောင် ရေးဖို့ အချိန်ပေး ကြိုးစားပါ။
  • တကယ်ကို Type ကြိုမသိနိုင်တဲ့ (Dynamic ဖြစ်တဲ့) တန်ဖိုးတွေအတွက် any အစား unknown ကို သုံးပါ။ ပြီးတော့မှ Program အလုပ်လုပ်နေချိန်မှာ typeof, instanceof တို့ကို သုံးပြီး Types တွေကို ပြန်လည် စစ်ဆေးတာ (Type Narrowing လုပ်တာ) မျိုး ပြုလုပ်ပါ။
  • // @ts-expect-error ဒါမှမဟုတ် // @ts-ignore လိုမျိုး Compiler ကို ကျော်ခိုင်းတဲ့ Comments တွေကို အရမ်း လိုအပ်မှသာ (ဥပမာ - External Library က Type မှားနေချိန်မျိုး) အသုံးပြုပါ။ ပြီးရင် ဘာကြောင့် သုံးထားရသလဲ ဆိုတာကို ရှင်းရှင်းလင်းလင်း မှတ်တမ်း (Comment) ရေးထားပါ။

၄။ ရှုပ်ထွေးတဲ့ Types တွေကို Debugging လုပ်ခြင်း

• အကြံပြုချက်:

  • သင်အသုံးပြုနေတဲ့ IDE (ဥပမာ - VS Code) ဟာ သင့်ရဲ့ အကောင်းဆုံး သူငယ်ချင်းပါ။ Variables တွေနဲ့ Types တွေပေါ်မှာ Mouse ကို ခဏတင် (Hover လုပ်) ကြည့်ပါ။ TypeScript က အဲ့ဒီ Variable ကို ဘယ်လို Type လို့ မှတ်ယူထားလဲဆိုတာ ချက်ချင်း မြင်ရပါလိမ့်မယ်။

  • ရှုပ်ထွေးတဲ့ Types တွေကို ပြုပြင် ပြောင်းလဲတဲ့အခါ အဆင့်ဆင့် ခွဲပြီး စစ်ဆေးနိုင်ဖို့အတွက်၊ ကြားခံ Type Alias တွေ (သီးသန့် Type နာမည်တွေ) ဖန်တီးပြီး စမ်းသပ်ကြည့်ပါ။

    User.ts

    type KeysOfUser = keyof User;
    // 👆 ဒီ Type ပေါ်မှာ Mouse တင်ကြည့်ရင် User ရဲ့ Keys တွေကို အတိအကျ မြင်ရပါမယ်။
    
    type PartialUser = Partial<User>;
    // 👆 ဒီ Type ပေါ်မှာ Mouse တင်ကြည့်ရင် Optional ဖြစ်သွားတဲ့ Type ပုံစံအသစ်ကို မြင်ရပါမယ်။

  • အကယ်၍ ရှုပ်ထွေးတဲ့ Type တစ်ခုက သင် မျှော်လင့်ထားသလို အလုပ်မလုပ်ဘူးဆိုရင်၊ အဲ့ဒီ Type ကို အရင်ဆုံး ရိုးရှင်းသွားအောင် (Simplify) ပြန်လုပ်ပါ။ ပြီးရင် သင်လိုချင်တဲ့ အတိုင်း အလုပ်လုပ်တဲ့အထိ အစိတ်အပိုင်း (Conditions/Generics) တွေကို တစ်ခုချင်းစီ ပြန်ပေါင်းထည့်ရင်း၊ ဘယ်နေရာမှာ ပြဿနာ ရှိနေလဲဆိုတာကို အဆင့်ဆင့် ရှာဖွေပါ ခင်ဗျာ။