TypeScript(4) 函式

前言

TypeScript函式語法優點會對資料型態做檢查，不像JavaScript那麼自由定義，你需要宣告參數的型態和回傳參數的型態．近一步會介紹rest/optional/default params 宣告方式和使用情境．

• JavaScript需要不需要知道函數參數資料型態，但是TypeScript有需要明確定義
• JavaScript呼叫函式參數不需要知道參數的個數， 但是TypeScript有明確定義，並提供rest/optional/default params宣告方式

---

基本函式宣告

TypeScript的函式宣告必須明確定義參數的資料型態、個數以及資料型態，基本上用法跟其他程式語言一樣．

語法：

function 函式名稱(參數名稱：資料型態)：回傳資料型態{
    //函式功能
}

範例：
函式宣告

let hello:string = "Hello World" ; 

//命名函式
function sayHello(message:string){
  console.log(message)
}
sayHello(hello)

//匿名函式
let anon_Hello = function(message:string):void{console.log(message)}
anon_Hello(hello);

預設參數(Default Parameters)

預設參數是當傳入 undefined 或是沒有傳入時，則會以 default parameter 取代。但是注意的地方為宣告預設參數必須在一般參數的後面，不然前面參數需要為undefined．

範例：

//預設參數
function feed(name="dog"):void{
    console.log(name);
}

feed("cat");
feed();
feed(undefined);

輸出結果：

cat
dog
dog


可選項參數(Optional Parameters)

TypeScript語法呼叫函式如果數目不正確是無法編譯，為了解決這個問題TypeScript提供optional parameters參數定義，就是你可以使用？來宣告資料型態

範例：

//可選項參數
function sayMyName(firstName:string, lastName?:string ){
    console.log(firstName+", "+lastName);
}
sayMyName("Lin");               //只傳入一個參數，編譯成功
sayMyName("Lin","Jone");      //編譯成功

輸出結果：

Lin, undefined
Lin, Jone


其餘參數(Rest Parameter)

當遇到傳入參數個數不確定時，傳統方式會使用陣列來當傳入參數；TypeScript有提供其餘參數的方式來解決傳入參數個數不確定的問題．

範例：

function sum(...values:number[] ){
    let result = 0;
    for (let val of values) {
        result += val;
    }
    return result;
}
sum();                       //編譯成功
sum(1, 2);                 //編譯成功
sum(1, 2, 3);             //編譯成功
sum(1, 2, 3, 4, 5, 6);   //編譯成功

輸出結果：

0
2
6
21


參考

1. unctions-rest-optional-default-params
2. https://oomusou.io/typescript/function/