> For the complete documentation index, see [llms.txt](https://lwin-moe-paing.gitbook.io/typescript-baby-by-lwin-moe-paing/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lwin-moe-paing.gitbook.io/typescript-baby-by-lwin-moe-paing/basic-typescript/ts-tuple.md).

# TS - Tuple

### Tuple

<figure><img src="/files/0Spvqbzcw0hwnGFdhPIW" alt=""><figcaption></figcaption></figure>

TypeScript မှာ Tuple ဆိုတာ array တစ်မျိုးပဲဖြစ်ပါတယ် ။&#x20;

အထူးသဖြင့် ကွဲပြားတဲ့ data type တွေပါဝင်ပြီး ၊ Fix Length အဖြစ် သတ်မှတ်ရပါတယ် ။

အရင်ဆုံး Color Code တွေသတ်မှတ်လို့ရမယ့် RGB (Red, Green, Blue) Color Tuple လေး ပြုလုပ်ကြည့်ရအောင်...&#x20;

<figure><img src="/files/2XpCn4PcvAa8qvJlwCRC" alt=""><figcaption></figcaption></figure>

RGB တန်ဖိုးအတွက် Fix Length  (၃) နေရာပဲ ယူလိုက်ပါမယ် ။&#x20;

တန်ဖိုး Type တွေကိုလည်း number ပဲ ထည့်လိုက်ပြီး Color Tuple Type အနေနဲ့ Custom Type သတ်မှတ်ထားတယ် ။&#x20;

ပြီးနောက် `redColor` variable ကို ColorTuple အဖြစ် တန်ဖိုး Assign ထည့်ပါမယ် ။&#x20;

ခုဏက သတ်မှတ်ထားတဲ့အတိုင်း Array Length (၃) နေရာပဲ number type တန်ဖိုးကို ထည့်သွင်းနိုင်မှာပါ ။

အခုဆို စာဖတ်သူက Color Tuple အဖြစ်ဖန်တီးလိုက်နိုင်ပါပြီ ။

<figure><img src="/files/KxQSfYvczeshoyrd1XYZ" alt=""><figcaption></figcaption></figure>

Tuple ကို Array Destructuring နည်းလမ်းနဲ့ ယူပြီး Variable တွေကို ပြုလုပ်နိုင်ပါတယ် ။&#x20;

နမူနာ Code အရ `redColor[0]` တန်ဖိုးက အနီရောင် တန်ဖိုးဖြစ်မှာပါ ။&#x20;

Destructuring ရေးသားနည်းနဲ့ index တစ်ခုချင်းဆီကို constant variable သုံးပြီး ၊ `red` , `green`, `blue` variables တွေ တည်ဆောက် အသုံးပြုနိုင်ပါတယ် ။

<figure><img src="/files/vy7CiRsfMWZLpulGpWA1" alt=""><figcaption></figcaption></figure>

ဒီတခါ မတူညီတဲ့ Data Type (၃) မျိုးကို ထည့်ပြီး `StrBooNum` Tuple လေး တည်ဆောက်ထားပါတယ် ။&#x20;

မိမိ စက်ထဲမှာ စမ်းသပ်ရေးသား ကြည့်ပြီး Console ထုတ်ကြည့်ပါ ။&#x20;

အခြေခံအားဖြင့် Tuple Type ဆိုတာ ဘာလဲ နားလည်လောက်ပါပြီ ။

### React useState hook tuple

လက်တွေ့မှာ အသုံးပြုတဲ့ Tuple Example လေးတစ်ခု ဖော်ပြလိုက်ရပါတယ် ။&#x20;

စာဖတ်သူတို့က React ကို လေ့လာဖူးတယ်ဆိုရင် React မှာ သုံးထားတဲ့ useState hook ရဲ့ Return type က Tuple ဖြစ်နေတာကို သိနိုင်မှာပါ ။

<figure><img src="/files/NmlrA9LuAec3da9beCRv" alt=""><figcaption></figcaption></figure>

useState hook ကိုခေါ်လိုက်တဲ့အခါ ကိုယ်ထည့်လိုက်တဲ့ Type တန်ဖိုး နဲ့ function type ကို Array အနေနဲ့ ပြန်ရလာမှာဖြစ်ပါတယ် ။ ဒါဟာ Tuple ပဲဖြစ်ပါတယ် ။