> 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="https://4062235122-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7tekcoDYDaKhlNreT5uK%2Fuploads%2FVxD2cHaTynbshLtxoyTn%2FTypescript%20Tuple%20Syntax.png?alt=media&amp;token=63dc1cb5-73ac-4471-9852-35a11614ff06" alt=""><figcaption></figcaption></figure>

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

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

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

<figure><img src="https://4062235122-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7tekcoDYDaKhlNreT5uK%2Fuploads%2FYplu2YREM044G5y6tqvT%2FTypescript%20Tuple%20Value%20Syntax.png?alt=media&amp;token=2fc11e9d-f907-4f84-8a66-e231dc0ce7df" 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="https://4062235122-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7tekcoDYDaKhlNreT5uK%2Fuploads%2FLlKGodn1ObgIFkdFJjvf%2FTypescript%20Tuple%20Destructuring%20Syntax.png?alt=media&amp;token=9a5bc02d-7f2c-438a-90ae-af025214a5bd" alt=""><figcaption></figcaption></figure>

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

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

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

<figure><img src="https://4062235122-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7tekcoDYDaKhlNreT5uK%2Fuploads%2FZ6oCBTyuMP9lyrLDztvl%2FTypescript%20Tuple%20Random%20Value%20Syntax.png?alt=media&amp;token=39a3ee9c-f8e2-4475-bc89-b5ad9913a4d0" 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="https://4062235122-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7tekcoDYDaKhlNreT5uK%2Fuploads%2FrE0Gr6Duicqw3kITgtG0%2FTypescript%20Tuple%20React%20Hook%20Example%20Syntax.png?alt=media&amp;token=1b103a09-1b71-4731-91e8-432c3ec5f3c0" alt=""><figcaption></figcaption></figure>

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