> 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-function.md).

# TS - Function

### Function Type

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

function type တစ်ခုကို ပြုလုပ်မယ်ဆိုရင် Parameter type ရယ် ၊ Return type ရယ် သတ်မှတ်ပေးဖို့လိုပါတယ် ။ Parameter မပါဘူးဆိုရင် `()` empty parameter အနေနဲ့  ရေးသားလို့လည်းရပါတယ် ။ အရင်ဆုံး `addFn` ဆိုတဲ့ ဂဏန်း (၂) လုံးပေါင်းတဲ့ function တစ်ခု တည်ဆောက်ပါမယ် ။

### Arrow Function

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

`addFn` arrow function အဖြစ် ရေးသာမှာဖြစ်ပါတယ် ။&#x20;

Parameters အနေနဲ့ `a` ရယ် `b` ရယ် အတွက် number type တွေ လက်ခံထားပါတယ် ။&#x20;

ပြီးတဲ့နောက် `:` နောက်မှာ Return Type အဖြစ် Number Type ပဲ ပြန်မယ်လို့ ရေးသားလိုက်ပါတယ် ။&#x20;

အခု ဆို Function တစ်ခု ဘယ်လို ဖန်တီး ရမလဲဆိုတာ လေ့လာခဲ့ပြီး ပါပြီ ။&#x20;

ဒါဆို Manual သတ်မှတ်ထားတဲ့ Return Type ကို ဖြုတ်ကြည့်လိုက်ပါမယ် ။

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

Return Type ကို Inference ပုံစံ TypeScript က အလိုအလျောက် သတ်မှတ်ပေးသွားမှာပါ ။

### Normal Function

Arrow Function ရေးသားနည်း လေ့လာပြီးသွားတဲ့အခါ ၊ ရိုးရိုး `function` keyword နဲ့ ရေးသားထားတာကို ကြည့်ကြရအောင် ... ။

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

`=` နဲ့ Arrow `=>` မပါတာက လွဲရင် ကျန်တဲ့ပုံစံကတော့ အတူတူပါပဲ ။&#x20;

အနောက်မှာလည်း Return Type ကို Manual သတ်မှတ်ပေးနိုင်ပါတယ် ။

<figure><img src="/files/1AKgJz6a4SjELFVuza2p" alt=""><figcaption></figcaption></figure>

Return Type ကို ဖြုတ်ကြည့်ပြီး Inference လုပ်သွားတာကိုလည်း အခုလို ရေးသားနိုင်ပါတယ် ။

### Custom Type Function

`type` keyword နဲ့ Custom Function Type ရေးသားနည်းကို လေ့လာသွားကြပါမယ် ။

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

ထူးခြားချက်အနေနဲ့ `:` မဟုတ်တော့ပဲ `=>` arrow sign နဲ့ Return Type  သတ်မှတ်ပေးတာ သတိပြုရမှာပါ ။ ကျန်တာကတော့ အတူတူပဲဖြစ်ပါတယ် ။  `AddFn` Type ကို variable  ကယူသုံးတဲ့အခါ parameter `a` နဲ့ `b` ကို type တွေ ထပ်သတ်မှတ်ပေးစရာမလိုတော့ပါဘူး ။ `AddFn` Type ထဲမှာတင် `a` နဲ့ `b` က number type ဆိုတာကို  TypeScript က ကြိုတင်သိနေပြီးသားမို့လို့ ဖြစ်ပါတယ် ။

### Function Void Type

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

Return တန်ဖိုးမရှိတဲ့ function တွေအတွက် void တန်ဖိုး ထည့်သွင်း အသုံးပြုနိုင်ပါတယ် ။

### Function Overloading

Function Overloading ဆိုတာက function တစ်ခုပဲ သုံးပြီး အမျိုးမျိုးသော Parameter type တွေ ၊ Return type တွေကို သီးခြားသတ်မှတ်ဖို့ ဖြစ်ပါတယ် ။

* Different Input Types ကို Handle လုပ်နိုင်ဖို့&#x20;
* Code Readability & Maintainability တိုးစေဖို့&#x20;
* Function name တစ်ခုပဲ သုံးပြီး အမျိုးမျိုးသော လုပ်ဆောင်မှုများစွာ ဖန်တီးနိုင်ဖို့ ဖြစ်ပါတယ် ။

ဥပမာ အနေနဲ့ Parameters (၂) မျိုးလက်ခံမယ့် `add` function ကို စဉ်းစားကြည့်ပါမယ် ။ Idea က number နှစ်လုံးထည့်ရင် ပေါင်းပေးမယ် ၊ string နှစ်လုံးထည့်ရင် string (၂) ခုကို concat လုပ်ပေးလိုက်မယ် ။&#x20;

Function Overloading ကို အသုံးပြုပြီး ရေးသားကြပါမယ် ။&#x20;

သူ့မှာ အပိုင်း (၂) ပိုင်းပါဝင်ပါတယ် ပထမအပိုင်းက **Signature** သတ်မှတ်ခြင်း ၊ ဒုတိယ အပိုင်းက **Code** **Implementation** လုပ်ခြင်းပဲ ဖြစ်ပါတယ် ။

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

#### Signature သတ်မှတ်ခြင်း&#x20;

အရင်ဆုံး `function` keyword ကို သုံးပြီး ကိုယ်ဖြစ်စေချင်တဲ့ signature ကို ရေးသားရမှာဖြစ်ပါတယ် ။

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

1st Signature မှာ parameter `a`  number type ဖြစ်ပြီး parameter `b` လည်း number ဖြစ်ရင် number type ပဲ return ပြန်ပါမယ် ။

2nd Signature မှာ parameter `a`  string type ဖြစ်ပြီး parameter `b` လည်း string ဖြစ်ရင် string type ပဲ return ပြန်ပါမယ် ။

ပြီးတဲ့အခါ သတ်မှတ်ထားတဲ့ Signature ရဲ့ Parameter တွေကို Cover ဖြစ်အောင် Code Implementation ပြန်လုပ်ပေးရမှာပါ ။

#### Implementation ပြုလုပ်ခြင်း

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

1st Signature မှာ `a` parameter သည် `number` type လက်ခံပြီး 2nd Signature အတွက် `string` type ကိုလက်ခံထားပါတယ် ။ ဒါကြောင့် Implementation Function သည် signature ၂ ခုလုံး cover ဖြစ်အောင် ပထမ Parameter ကို `number | string` နဲ့ လက်ခံရပါမယ် ။ parameter `b` အတွက်ကော return type အတွက်ပါ cover ဖြစ်အောင် string | number နဲ့ ပြောင်းလဲပြီး implement လုပ်ထားလိုက်ပါပြီ ။

ပြီးတဲ့အခါကြမှ JavaScript Code Implementation အဆင့်ရောက်ပြီး Logic ကို ရေးသားကြရမှာဖြစ်ပါတယ် ။

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

Code အပြည့်အစုံကို ရေးသားဖော်ပြလိုက်ပါတယ် ။ ဒီလောက်ဆို Function Overload ကို အခြေခံအားဖြင့် နားလည်သွားပြီလို့ ယူဆပါတယ် ။
