介紹

函數是JavaScript應用程序的基礎。 函數實現了抽象層，模擬類，信息隱藏和模塊。 在TypeScript里，雖然已經支持類，命名空間和模塊，但函數仍然是主要的定義 行為的地方。 TypeScript為JavaScript函數添加了額外的功能，讓我們可以更容易地使用。

在JavaScript中，我們通常這樣定義函數：

//  命名函數
function add(x, y) {
    return x+y;
}
//  匿名函數
var add = function(x,y) { return x+y;  }

typeScript中的函數

函數的定義

我們可以為函數的參數添加類型，再為函數本身添加返回值類型。ts能夠根據返回語句自動推斷出返回類型，因此我們常常省略它。

function add(x:number, y:number):number {
    return x+y;
}
var add = function(x:number, y:number):number { return x+y; }

可選參數和默認參數

ts中每個函數的參數都是必須得，但這并不代表參數不能是null或undefined，而是指編譯器會檢查用戶是否為每個參數都傳入了值。也就是說，傳遞給一個函數的參數個數必須與函數期望的參數個數一致。

function fullName(firstName:string, lastName:string) {
    return firstName+lastName;
}
let a = fullName('bob');   //  error  少一個參數
let b = fullName('bob', 'tom', 'mary');  //  error  多一個參數
let c = fullName('bob', 'tom');   //  right

JavaScript里，每個參數都是可選的，可傳可不傳。 沒傳參的時候，它的值就是undefined。 在TypeScript里我們可以在參數名旁使用 ?實現可選參數的功能。 比如，我們想讓lastName是可選的：

function fullName(firstName:string, lastName?:string) {
    if(lastName) {
        return firstName+lastName;
    }else {
        return firstName;
    }
}
let a = fullName('bob');   //  right now
let b = fullName('bob', 'tom', 'mary');  //  error  多一個參數
let c = fullName('bob', 'tom');   //  right

可選參數必須跟在必須參數后面。 如果上例我們想讓firstName是可選的，那么就必須調整它們的位置，把firstName放在后面。

在ts中，我們也可以為參數提供一個默認值，當用戶沒有傳入這個參數或傳入undefined時，他們就是有默認初始值的參數。我們修改上面的例子lastName默認為tom；

function fullName(firstName:string, lastName='tom') {
    return firstName+'  ' +lastName;
}
let a = fullName('bob');   //  bob tom
let b = fullName('bob', 'tom', 'mary');  //  error  多一個參數
let c = fullName('bob', undefined);   //  bob tom
let d = fullName('bob', 'mary');  //  bob mary

剩余參數

必要參數，默認參數和可選參數有個共同點：它們表示某一個參數。 有時，你想同時操作多個參數，或者你并不知道會有多少參數傳遞進來。 在JavaScript里，你可以使用 arguments來訪問所有傳入的參數。ES6中使用三點運算符來接受參數傳遞過來的值。如下例：計算多個參數的和

//  JS的寫法
function sum(a,b,c,d) {
    return a+b+c+d;
}
//  ts引入三點運算的寫法
function sum(a:number, ...b:number[]):number{
  var sum = 0;
  for(var i = 0; i < b.length; i++){
      sum+=b[i];
    }
    return sum;
}
//  按照js中我們只能計算4個以上參數的和，而下面ts的寫法可求任意個參數的和

剩余參數會被當做個數不限的可選參數。 可以一個都沒有，同樣也可以有任意個。

函數重載

java中方法的重載：重載指的是兩個或者兩個以上同名函數，但它們的參數不一樣，這時會出現函數重載的情況。
typescript中的重載：通過為同一個函數提供多個函數類型定義來試下多種功能的目的。
ts為了兼容es5 以及 es6 重載的寫法和java中有區別。

es5中出現同名的函數，下面的會替換上面的函數

function css(config){}
function css(config,value){}

ts中的重載

// 例1
function getInfo(name:string):string;
function getInfo(age:number):string;
function getInfo(str:any):any{
  if(typeof str==='string'){
      return '我叫：'+str;
  }else{
      return '我的年齡是'+str;
  }
}
alert(getInfo('張三'));   //正確
alert(getInfo(20));   //正確
alert(getInfo(true));    //錯誤寫法

//  例2
function getInfo(name:string):string;
function getInfo(name:string,age:number):string;
function getInfo(name:any,age?:any):any{
    if(age){
       return '我叫：'+name+'我的年齡是'+age;
    }else{
      return '我叫：'+name;
   }
}
alert(getInfo('zhangsan'));  /*正確*/
alert(getInfo(123));  錯誤
alert(getInfo('zhangsan',20));

getInfo函數根據傳入參數的不同類型，執行不同的函數。
上一篇TypeScript基礎入門（二）主要介紹ts的基本數據類型
下一篇TypeScript基礎入門（四）主要介紹ts的類與接口