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

我們先來回憶一下JavaScript的函數(shù)，有匿名函數(shù)和有名字的函數(shù)，和JavaScript一樣，TypeScript函數(shù)可以創(chuàng)建有名字的函數(shù)和匿名函數(shù)。 你可以隨意選擇適合應用程序的方式，不論是定義一系列API函數(shù)還是只使用一次的函數(shù)。

// 有名函數(shù)
function add(x, y) {
    return x + y;
}

// 匿名函數(shù)
let myAdd = function(x, y) { return x + y; };

在JavaScript里，函數(shù)可以使用函數(shù)體外部的變量。 當函數(shù)這么做時，我們說它‘捕獲’了這些變量。

let z = 100;
function addToZ(x, y) {
    return x + y + z;
}

以上是JavaScript定義函數(shù)的方法，接下來就是ts里面定義函數(shù)的方法

一、ts定義函數(shù)

//函數(shù)聲明法
function run():string{
  return 'run'
}

定義的是什么返回類型，返回類型必須和定義的一致，不然會報錯，舉個錯誤的例子：

//錯誤寫法
function run():string{
  return 123
}

我們再來看下怎么定義匿名函數(shù)：（和定義有名函數(shù)一樣，根據(jù)定義的類型返回相應的類型）

var run2 = function():number{
  return 123
}

二、ts中定義方法的傳參

有名函數(shù)的傳參：

function getInfo(name:string,age:number):string{
  return `${name} --- ${age}`
}
getInfo('張三',18)

匿名函數(shù)傳參:

var getInfo1 = function(name:string,age:number):string{
  return `${name} --- ${age}`
}
getInfo1('張三',18)

解析：傳遞參數(shù)的時候，對參數(shù)定義類型，就比如我上面定義了name的類型是個字符串類型，age類型是個數(shù)字類型，所以我們調取方法的時候，根據(jù)類型對應好傳參，是不會報錯的，但是如果明明要求傳字符串類型，卻寫了數(shù)字類型，就會報錯啦。

這里再拓展說明一下，還有一種，是不會有返回值的方法：

function run3():void{
  console.log('沒有返回值')
}

三、ts方法可選參數(shù)

es5里面的方法的實參和形參可以不一樣，但是ts中必須一樣，如果不一樣就要配置可選參數(shù)。
那么上面這句話是什么意思呢，我們來舉個例子：假如說，我們現(xiàn)在要傳名字和年齡，那我如果不想傳年齡過去，我們可以怎么寫呢

function getInfo2(name:string,age:number):string{
  if(age){
    return  `${name} --- ${age}`
  }else{
    return `${name}--- 年齡保密`
  }
}
getInfo2('張三',17)

解析：如果我們像上面這么寫的話，和正常傳參一樣，不過里面加上了if的判斷而已，但是如果我們不傳17，就會報錯了，說明這種寫法并不正確。所以ts給出了一個新的形式，就是在可傳參數(shù)的后面加上一個?。就如同下面的寫法：

function getInfo2(name:string,age?:number):string{
  if(age){
    return  `${name} --- ${age}`
  }else{
    return `${name}--- 年齡保密`
  }
}
getInfo2('張三')

注意：這里還有個需要注意的地方，就是這個可選參數(shù)必須配置到參數(shù)的后面，什么意思呢，就是說如果name是可傳的，age是必傳的，那么就會報錯，因為ts需要我們對應

//錯誤寫法
function getInfo2(name?:string,age:number):string{
  if(age){
    return  `${name} --- ${age}`
  }else{
    return `${name}--- 年齡保密`
  }
}
getInfo2(18)

當然了，這里有同學就會問了，那我name可傳，age也可傳，可不可以呢，如果你最后傳的值都是沒有的，比如getInfo2()或者是getInfo2('張三'),這樣是可以的，但是寫成getInfo2(18)，那就不行了，原因就和上面舉的例子一樣。

四、ts默認參數(shù)

es5里面沒法設置默認參數(shù)，es6和ts中都可以設置默認參數(shù)。
這個默認參數(shù)和上面的可選參數(shù)類似，你稱為默認可選參數(shù)都可以。

function getInfo3(name:string,age:number=20):string{
  if(age){
    return  `${name} --- ${age}`
  }else{
    return `${name} --- 年齡保密`
  }
}
getInfo3('張三')

分析：默認參數(shù)，顧名思義，就是傳入的值一開始就有，就比說這里，name是string類型，age是number類型，但是給了一個20的初始值，所以，傳參數(shù)的時候，即使你沒有傳遞，后面的age，運行的時候也可以將默認的age = 20，賦值上去，當然了，如果你后面要再傳age，就比如getInfo3('張三',18)，也是可以的，會覆蓋掉默認值。你也可以age寫在前面，number寫后面，只要傳參對應好，都可。

五、ts剩余參數(shù)

有時，你想同時操作多個參數(shù)，或者你并不知道會有多少參數(shù)傳遞進來。 在JavaScript里，你可以使用arguments來訪問所有傳入的參數(shù)。
在TypeScript里，你可以把所有參數(shù)收集到一個變量里。
首先，大家可以看下面的一個例子：

function sum(a:number,b:number,c:number,d:number):number{
  return a+b+c+d
}
sum(1,2,3,4)

分析：這種非常的簡單，傳入abcd，四個參數(shù)，求和，那么問題來了，如果我要求和的數(shù)非常的，我一個個寫，是不是過于麻煩了點，所以，這里，ts，給我了一個簡便的寫法，三點運算符。

function sum1(...result:number[]):number{
   var sum = 0
   for(var i = 0;i<result.length;i++){
     sum += result[i]
   }
   return sum
}
sum(1,2,3,4)

分析：傳入的1234實際上，就已經(jīng)存在了result數(shù)組里面了，經(jīng)過循環(huán)相加，得到我們想要的求和。

再比如說，下面的這種情況，一一對應關系，a = 1，b=2，那么result數(shù)組就是[3,4],所以我們最后得到的和是和上面的sum1函數(shù)一樣的。

function sum2(a:number,b:number,...result:number[]):number{
  var sum = a+b
  for(var i = 0;i<result.length;i++){
    sum += result[i]
  }
  return sum
}
sum(1,2,3,4)

六、ts函數(shù)重載

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

function css(){
     return '第一個函數(shù)'
}
function css(config){
     return '第二個函數(shù)'
}

上述代碼，返回的會是第二個函數(shù)

function getInfos(name:string):string;

function getInfos(age:number):number;

function getInfos(str:any):any{
   if(typeof str === 'string'){
      return '我叫'+str
    }else{
      return '我的年齡是'+str
    }
  }
getInfos('張三')  //正確寫法
getInfos(20)  //正確寫法
getInfos(true) //錯誤寫法

解析：一個比較簡答的例子，按照順序執(zhí)行下來，肯定是執(zhí)行最后一個函數(shù)里面的方法，但是如果你傳入的類型，和之前傳入的參數(shù)類型對應不上，就會報錯。

我們還能最拓展一下，鞏固記憶：

function getInfoss(name:string):string;

function getInfoss(name:string,age:number):string;

function getInfoss(name:any,age?:any):any{
   if(age){
      return '我叫'+ name + '我的年齡是'+age
    }else{
      return '我叫'+ name
    }
  }
getInfos('張三')  //正確寫法
getInfos(20)  //錯誤寫法
getInfos('張三',20) //正確寫法

我覺得ts函數(shù)重載，只是多了一個參數(shù)校驗的功能（只是個人想法）

七、ts箭頭函數(shù)

箭頭函數(shù)里面的this，指向的是上下文

  setTimeout(function(){
    alert('run')
  },1000)

  setTimeout(()=>{
   alert('run')
  },1000)

這個箭頭函數(shù)，沒什么要說的，就和之前的一樣

本文的最后按照慣例來推薦歌曲了，周杰倫的《手寫的從前》，希望你能對那個人說出，“我想我屬于一個擁有你的未來，你是我未來的規(guī)劃之一”，我們下一章再見。