轉載

TypeScript基礎入門 – 函式 – 簡介

專案實踐倉庫

https://github.com/durban89/typescript_demo.git
tag: 1.1.6

為了保證後面的學習演示需要安裝下ts-node，這樣後面的每個操作都能直接執行看到輸出的結果。

npm install -D ts-node

後面自己在練習的時候可以這樣使用

npx ts-node 指令碼路徑

函式

介紹

函式是JavaScript應用程式的基礎。 它幫助你實現抽象層，模擬類，資訊隱藏和模組。 在TypeScript裡，雖然已經支援類，名稱空間和模組，但函式仍然是主要的定義 行為的地方。 TypeScript為JavaScript函式新增了額外的功能，讓我們可以更容易地使用。說實話我都不想看這塊的東西，函式嘛是個寫程式的都會寫，但是為了追求整體及探索新的知識，沒準有意外發現，還是要學習下。

函式

和JavaScript一樣，TypeScript函式可以建立有名字的函式和匿名函式。 你可以隨意選擇適合應用程式的方式，不論是定義一系列API函式還是隻使用一次的函式。通過下面的例子可以迅速回想起這兩種JavaScript中的函式：

function add(x, y) {
    return x + y
}

let addFunc = function(x, y) { return x + y }

在JavaScript裡，函式可以使用函式體外部的變數。 當函式這麼做時，我們說它‘捕獲’了這些變數。 
至於為什麼可以這樣做以及其中的利弊超出了本文的範圍，但是深刻理解這個機制對學習JavaScript和TypeScript會很有幫助。

let z = 10;
function addTo(x, y) {
    return x + y + z;
}

函式型別

為函式定義型別
讓我們為上面那個函式新增型別

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

let addFunc = function (x: number, y: number): number { return x + y }

我們可以給每個引數新增型別之後再為函式本身新增返回值型別。 TypeScript能夠根據返回語句自動推斷出返回值型別，因此我們通常省略它。

書寫完整函式型別

現在我們已經為函式指定了型別，下面讓我們寫出函式的完整型別。

let addFunc: (x: number, y:number) => number = function(x: number, y: number): number { return x + y }

函式型別包含兩部分：引數型別和返回值型別。 當寫出完整函式型別的時候，這兩部分都是需要的。 我們以引數列表的形式寫出引數型別，為每個引數指定一個名字和型別。 這個名字只是為了增加可讀性。 我們也可以這麼寫

let addFunc: (baseValue: number, increment: number) => number = function (x: number, y: number): number { return x + y }

只要引數型別是匹配的，那麼就認為它是有效的函式型別，而不在乎引數名是否正確。

第二部分是返回值型別。 對於返回值，我們在函式和返回值型別之前使用( =>)符號，使之清晰明瞭。 如之前提到的，返回值型別是函式型別的必要部分，如果函式沒有返回任何值，你也必須指定返回值型別為 void而不能留空。

函式的型別只是由引數型別和返回值組成的。 函式中使用的捕獲變數不會體現在型別裡。 實際上，這些變數是函式的隱藏狀態並不是組成API的一部分。

推斷型別

嘗試這個例子的時候，你會發現如果你在賦值語句的一邊指定了型別但是另一邊沒有型別的話，TypeScript編譯器會自動識別出型別：

let addFunc = function(x: number, y: number): number { return x + y }

let addFunc: (baseValue: number, increment: number) => number = function(x, y) { return  x + y }

這叫做“按上下文歸類”，是型別推論的一種。 它幫助我們更好地為程式指定型別。

本例項結束實踐專案地址

https://github.com/durban89/typescript_demo.git
tag: 1.2.0