TypeScript真香系列-函數

前言

TypeScript真香系列的內容將參考中文文檔，可是文中的例子基本不會和文檔中的例子重複，對於一些地方也會深刻研究。另外，文中一些例子的結果都是在代碼沒有錯誤後編譯爲JavaScript獲得的。若是想實際看看TypeScript編譯爲JavaScript的代碼，能夠訪問TypeScript的在線編譯地址，動手操做，印象更加深入。

函數的基礎

函數是JavaScript應用程序的基礎，一樣TypeScript也能夠建立有名字的函數和匿名函數，不過TypeScript在JavaScript的基礎之上添加了不少額外並且頗有用的功能。

函數類型及定義

TypeScript中也能夠以函數式聲明和函數表達式來定義函數：

// 函數式聲明
function sum(a: number, b: number): number {
    return a + b;
}

//函數表達式
let sumTwo = function(a: number, b: number): number { return a + b; };

在上面的例子中，咱們給函數添加了類型，給輸入的參數和返回值都進行了嚴格的定義，這樣在開發的時候，會避免一些問題的出現。固然咱們也能夠省略返回值類型，由於TypeScript能夠根據返回語句自動的推斷出返回值的類型，這被叫作「按上下文歸類」，這個在後續的章節會講到。

function sum(a: number, b: number){
    return a + b;
}

既然是JavaScript的超集，那麼箭頭函數也是能夠的：

let sumTwo = (a: number, b: number) => { return a + b; };

可選參數

當咱們在TypeScript函數中指定了參數後，在調用函數的時候就必須傳入相應個數的參數。

function sum(a: number, b: number) {
    return a + b;
}
sum(1, 3); //4
sum(1); //錯誤，指望是兩個參數，可是隻有一個

在JavaScript中，函數的參數是可選的，若是在調用函數的時候沒有傳指定的參數的話，這個參數就是undefined。在TypeScript中咱們能夠指定參數爲可選，這樣咱們在調用函數的時候就能夠選擇傳參了。

function sum(a: number, b ?: number) {
    return a + b; // 錯誤，b多是undefined
}
sum(1, 3);
sum(1);

上面的例子中，a加一個undefined是沒有意義的，因此咱們能夠像上面這個例子同樣，用 "?" 來表示可選：

function sum(a: number, b?: number) {
    if (b) { 
        return a + b;
    } else {
        return a;
    }
    
}
sum(1, 3); // 4
sum(1);  //1

更能夠這樣：

function sum(a: number, b?: number) {
   return b ? a + b: a ;
}
sum(1, 3); //4
sum(1);  //1

默認參數

和JavaScript同樣，咱們一樣能夠給TypeScript函數的參數指定默認值：

function sum(a: number, b = 6) {
    return a + b;
}
sum(1, 3); //4
sum(1); //7

能夠從上面的例子看出來，給參數設默認值後的參數若是在末尾的話，那麼在函數調用的時候也是可選的。若是默認值參數不在末尾呢？能夠看看下面這個例子：

function sum(a = 1, b : number) {
    return a + b;
}
sum(1, 3); //4
sum(1); //錯誤，指望是兩個參數，可是隻有一個參數
sum(undefined, 1); //2

剩餘參數

TypeScript中的剩餘參數也能夠說就至關於js中的剩餘操做符（rest）,用 "..." 表示，用法差很少：

function fn(a: number, b: string, ...args:string[]) {  
   return args.length;
}
fn(1, "2", "3", "4", "5" );  // 3

還有諸多相似JavaScript函數的操做，在TypeScript也有所體現。

參考

https://github.com/zhongsp/Ty...

最後

文中有些地方可能會加入一些本身的理解，如有不許確或錯誤的地方，歡迎指出~