摘要：別急還沒說完我們使用操作符構(gòu)造了類的一個(gè)實(shí)例，這會(huì)調(diào)用類的構(gòu)造函數(shù)，按照定義對(duì)實(shí)例進(jìn)行初始化注意為了兼容和，中的類會(huì)被編譯為中的函數(shù)。

“我們?yōu)樾枰獦?gòu)建和維護(hù)大型JavaScript程序的團(tuán)隊(duì)設(shè)計(jì)了TypeScript，以滿足他們的需求。TypeScript可幫助他們?cè)谲浖M件之間定義接口，并且?guī)椭斫猬F(xiàn)存JavaScript庫的行為。同時(shí)，使用TypeScript的團(tuán)隊(duì)可以將代碼構(gòu)建成動(dòng)態(tài)加載的模塊，以減少命名沖突的問題。TypeScript可選的類型系統(tǒng)使開發(fā)者們可以使用一些高效的開發(fā)工具和最佳實(shí)踐:靜態(tài)檢查，基于符號(hào)的導(dǎo)航，代碼補(bǔ)全和代碼重構(gòu).  摘自——TypeScript語言特性”

此部分直接開始我們的干貨之旅，以下是作者本人經(jīng)過親身實(shí)踐，采用圖文并茂的方式給大家詳細(xì)講解基本上手配置環(huán)境的過程。

如果你用的是VsCode，那么作者為你感到高興，因?yàn)檎f明你與作者站到了一起。廢話不多說，先上干貨：

看見上圖你就知道你Ts的環(huán)境已經(jīng)完成，下面你需要的是擼起袖子書寫你第一句HelloWorld吧！

2.如果你使用其他代碼編譯器或者使用的是OS X 或 Linux操作系統(tǒng)，可以下載一個(gè)NPM模塊，如果你不熟悉npm也不需要擔(dān)心，到目前為止，只需要知道它是Node包管理的標(biāo)準(zhǔn)并且是Node.js的默認(rèn)包管理工具即可。為了能使用npm，你需要先在開發(fā)環(huán)境中安裝node.js。可以在Node.js的官方網(wǎng)站上https://node.js.org/找到相應(yīng)...。（寫了這么多騷氣的告訴你，無論你用哪一種node已經(jīng)無孔不入。已經(jīng)不再是你的可選項(xiàng)，趕緊下載一個(gè)去吧！）對(duì)了！ 別忘了 npm install -g typescript

3.繼續(xù)在命令行環(huán)境下鍵入 tsc -init 進(jìn)行初始化，
你會(huì)發(fā)現(xiàn)根目錄下多了 tsconfig.json 的文件，記錄了編譯成JS的選項(xiàng)
打開該文件，會(huì)發(fā)現(xiàn)主要選項(xiàng)已經(jīng)幫你設(shè)置好了，比較常用的設(shè)置是
”target” : 編譯為何種規(guī)范，一般設(shè)置為 ES5 或者 ES2016/2017
“outdir” : 輸出目錄
“alwaysStrict” ： 打開嚴(yán)格模式 (‘use strict’)
命令行下輸入 code . 打開VSCode進(jìn)入該目錄，按下 Ctrl+shift+B 快捷鍵會(huì)進(jìn)行編譯，初次編譯會(huì)選擇編譯模式，如下圖所示:

我們?cè)诖颂庍x擇監(jiān)視模式，這樣基于以上的幾點(diǎn)就完成了Ts的基本配置任務(wù)

經(jīng)過作者（*中保）在前面一段云里霧里的講解不知道給大家講懂了多少，如果還有細(xì)節(jié)不理解的地方可以聯(lián)系作者本人，接下來就要介紹類型:

先擼一把概念:首先我們已經(jīng)了解了TypeScript是JavaScript的超集，TypeScript通過向JavaScript增加可選的靜態(tài)類型聲明來把JavaScript變成強(qiáng)類型的程序語言。可選的靜態(tài)類型聲明可約束函數(shù)，變量，屬性等程序?qū)嶓w，這樣編譯器和相應(yīng)的開發(fā)工具就可以在開發(fā)過程中提供更好的正確性驗(yàn)證和幫助功能，大家看到這的朋友如果是滿嘴我靠，我靠，我靠。說的什么，感覺好專業(yè)一句聽不懂。作者本人為了讓大家接受到最專業(yè)的類型解釋語句，是在自己的書中，結(jié)合視屏學(xué)習(xí)過程中抽離了精華，進(jìn)行了語句本身的重構(gòu)。嘻嘻看到這里如果還覺的少給我裝逼有干貨沒？說了這么多請(qǐng)看作者自己實(shí)際操作的下圖:

寫到這里還有很多朋友問我，你最喜歡Ts的什么地方，目前來講:1.強(qiáng)類型特性能讓程序員對(duì)自己和其他開發(fā)團(tuán)隊(duì)成員在代碼中表達(dá)出意圖 2.TypeScript類型檢測(cè)在編譯時(shí)期進(jìn)行并且沒有運(yùn)行時(shí)的開銷。
此處溫馨提示一下，let與const關(guān)鍵字在TypeScript1.4中就可以使用了，但只有在編譯目標(biāo)為ECMAScript6或者以上時(shí)才可用，大家如果想使用還需要手動(dòng)在package.json中手動(dòng)配置下方可使用。

2.接下來就是我們講述類型的重中之重了，既然本章節(jié)是講類型，先帶大家了解下Ts的基本類型（此處與JS略有不同希望大家仔細(xì)閱讀）

基本類型有boolean,number,string,array,void和所有用戶自定義的enum類型。（此處大家要重點(diǎn)了解的是所有上述講到的類型在TS中，都是一個(gè)唯一的頂層的AnyType類型的子類型，any關(guān)鍵字代表這種類型。讓我們看一下這些原始類型。下面是我本人整合的一些內(nèi)容基本都在這里了）

此處不知道大家有沒有什么想法？（反正我是沒有），接下來就給大家介紹一種聯(lián)合類型（以圖中的內(nèi)容為主）。

聯(lián)合類型用來聲明那些可以存儲(chǔ)多種類型值的變量。在上面這個(gè)例子中，我們聲明了一個(gè)可以存儲(chǔ)一個(gè)（字符串）或者一組路徑（字符串?dāng)?shù)組）的變量Lzb。在例子中，我們也對(duì)這個(gè)變量進(jìn)行了賦值，將字符串和字符串的數(shù)組合法地賦值給了這個(gè)變量。然而，當(dāng)試圖將一個(gè)數(shù)字賦值給它時(shí)我們遇到了一個(gè)編譯錯(cuò)誤，因?yàn)檫@個(gè)聯(lián)合類型并沒有聲明number為它的合法類型。

此處我給大家介紹一部分函數(shù)的內(nèi)容（此部分內(nèi)容個(gè)人認(rèn)為尤為重要）:且看下圖

下面是將Ts轉(zhuǎn)換為JS后的內(nèi)容繼續(xù)看下圖:

在ECMAScript6（即最新版本的JavaScript）中，添加了基于類的面向?qū)ο缶幊陶Z法。由于TS是基于ES6的，所以開發(fā)者如今就已經(jīng)可以開始使用基于類的面向?qū)ο蟮恼Z法中了。TS的編譯器會(huì)負(fù)責(zé)將TS代碼編譯為兼容主流瀏覽器和平臺(tái)的JavaScript代碼。

讓我們來看一個(gè)在TS中定義類的例子:（如下圖所示）

簡(jiǎn)單來講，在上面的例子里，我們一起定義了一個(gè)名為Character的新類。這個(gè)類有三個(gè)成員:一個(gè)名為fullname的屬性，一個(gè)構(gòu)造函數(shù)constructor,和一個(gè)greet方法。當(dāng)我們?cè)赥s中聲明類時(shí)，所有的屬性和方法默認(rèn)都是公共的。或許你可能已經(jīng)留意到，當(dāng)（在對(duì)象內(nèi)部）訪問對(duì)象內(nèi)的成員時(shí)，我們都在前面加上了this操作符，this操作符表明了這是一個(gè)成員訪問操作（好吧，排除前面一大段日常裝逼操作，返璞歸真的來說，如果你在類內(nèi)部想定義一個(gè)屬性，如果你不在構(gòu)造函數(shù)constructor中this給其賦值的話，用有道詞典的話來講屬性“fullname”沒有初始化器，也沒有在構(gòu)造函數(shù)中明確指定。）簡(jiǎn)單來講就會(huì)報(bào)錯(cuò)。別急還沒說完（我們使用new操作符構(gòu)造了Character類的一個(gè)實(shí)例，這會(huì)調(diào)用類的構(gòu)造函數(shù)，按照定義對(duì)實(shí)例進(jìn)行初始化）

注意:為了兼容ECMAScript3 和 ECMAScript5，TS中的類會(huì)被編譯為JavaScript中的函數(shù)。

在學(xué)習(xí)這部分內(nèi)容之前必須先隆重介紹下我們的函數(shù):函數(shù)是任何TypeScript應(yīng)用程序中的基礎(chǔ)功能塊，它們非常強(qiáng)大，我們最開始接觸函數(shù)概念應(yīng)該是在數(shù)學(xué)當(dāng)中，記得當(dāng)時(shí)講解的是:函數(shù)是執(zhí)行某項(xiàng)特定功能的模塊。同樣這樣的概念，也可以延伸到我們的編程當(dāng)中。

函數(shù)聲明和函數(shù)表達(dá)式:

函數(shù)在TS中分為了顯示指定函數(shù)名稱的（命名函數(shù)）和不顯示指定名稱的（匿名函數(shù)）我們看下圖代碼來具體理解

人生若只如初見，你會(huì)感覺什么都很美好！就和上面這兩種函數(shù)一樣（那么的熟悉，那么的相似），但是它們的行為并不一樣，解釋器會(huì)首先在代碼解釋階段執(zhí)行函數(shù)聲明，而另一方面，除非函數(shù)表達(dá)式被賦值。否則就不會(huì)被執(zhí)行。（好吧，到這里我相信我需要再用白話來解釋下，簡(jiǎn)單的來講如果你僅僅是函數(shù)聲明，像圖中的第一個(gè)函數(shù)的形式的話，你的調(diào)用可以發(fā)生在前后都可以，但是如果是第二種則會(huì)發(fā)生變量提升的過程，所以如果你是在之前去調(diào)用的話，結(jié)果就和圖中的一樣畫了個(gè)紅線。）

函數(shù)的類型

先看下面截圖我們?cè)僮鼋忉?

在上述函數(shù)中，我們定義了參數(shù)name的類型（string）和返回值類型（string）.有時(shí)候我們不只需要定義函數(shù)中元素的類型，還需要定義函數(shù)本身的類型。讓我們?cè)倏聪孪旅孢@個(gè)截圖:

在上述例子中，我們聲明了變量greetUnnamed 及其類型。greetUnnamed的類型是一個(gè)只包含一個(gè)名為name的string類型參數(shù)，在調(diào)用后返回類型為string的函數(shù)。在聲明了這個(gè)變量之后，一個(gè)完全符合變量類型的函數(shù)被賦值給了它。我們也可以聲明greetUnnamed的類型，并在同一行中將一個(gè)函數(shù)賦值給它，而不是分割成兩行，比如下面這個(gè)例子:

就像上面這個(gè)例子，之前的代碼片段中同樣聲明了變量greetUnnamed和它的類型。我們也可以在同一行中把一個(gè)函數(shù)賦值給這個(gè)變量，被賦值的函數(shù)類型必須與變量類型相同。

有可選參數(shù)的函數(shù)
與JavaScript 不同，調(diào)用函數(shù)時(shí)傳的參數(shù)的數(shù)量或類型不符合函數(shù)中定義的參數(shù)要求時(shí)，TypeScript編譯器會(huì)報(bào)錯(cuò)。讓我們通過一個(gè)代碼示例來證明這點(diǎn):

上述函數(shù)名為Add并包含三個(gè)number類型參數(shù):LZB,Bar,LZBbar。如果調(diào)用這個(gè)函數(shù)時(shí)沒有完整地傳入三個(gè)參數(shù)，會(huì)得到一個(gè)編譯錯(cuò)誤，提示提供的參數(shù)與函數(shù)聲明中的參數(shù)無法匹配。

在一些場(chǎng)景下，我們也許想調(diào)用這個(gè)函數(shù)且不提供所有的參數(shù)。TypeScript提供了一個(gè)函數(shù)可選參數(shù)的特性，可以幫助增加這個(gè)函數(shù)的靈活性。可以在TypeScript中通過在函數(shù)參數(shù)后追加一個(gè)字符？，指定函數(shù)參數(shù)是可選的。更新一下前面的函數(shù)，將LZBbar參數(shù)從必選參數(shù)修改為可選參數(shù)。

請(qǐng)看清楚，我們?cè)诖藢?shù)LZBbar的名稱更改為了LZBbar?,并在函數(shù)內(nèi)部檢測(cè)LZBbar參數(shù)是否被提供。修改后，在我們提供兩個(gè)或者三個(gè)參數(shù)調(diào)用這個(gè)函數(shù)時(shí)，TypeScript編譯器不再拋出錯(cuò)誤。

值得注意的是，可選參數(shù)必須位于必選參數(shù)列表的后面。

有默認(rèn)參數(shù)的函數(shù)

當(dāng)函數(shù)有可選參數(shù)時(shí)，我們必須檢測(cè)參數(shù)是否被傳遞了（就像上一個(gè)例子中那樣）。
  在一些場(chǎng)景中，應(yīng)為一個(gè)可選參數(shù)設(shè)置默認(rèn)值。可以使用內(nèi)聯(lián)if結(jié)構(gòu)重寫Add函數(shù)（從上一個(gè)代碼片段中）

這個(gè)函數(shù)并沒有錯(cuò)誤，但是可以通過提供LZBbar參數(shù)的默認(rèn)值，來代替標(biāo)記其為可選參數(shù)，以改善其可讀性。

我們只需要在聲明函數(shù)簽名時(shí)使用 = 操作符提供一個(gè)默認(rèn)值，即可指定函數(shù)參數(shù)是可選的。TypeScript編譯器會(huì)在JavaScript輸出結(jié)果中生成一個(gè)if結(jié)構(gòu)，在LZBbar參數(shù)沒有傳遞給函數(shù)時(shí)設(shè)置一個(gè)默認(rèn)值。

有剩余參數(shù)的函數(shù)

我們已經(jīng)了解了如何使用可選和默認(rèn)參數(shù)來改善函數(shù)調(diào)用。讓我們?cè)倩氐缴弦粋€(gè)例子中:

我們?cè)谥暗膶W(xué)習(xí)過程中已經(jīng)學(xué)習(xí)到了如何調(diào)用Add函數(shù)并傳遞兩個(gè)或者三個(gè)參數(shù)，但是如果希望允許其他開發(fā)者傳遞四個(gè)或者五個(gè)參數(shù)呢？不得不再添加兩個(gè)額外的默認(rèn)或者可選參數(shù)。那如果希望允許開發(fā)者傳遞任意數(shù)量的參數(shù)呢？解決方案是使用剩余參數(shù)。剩余參數(shù)語法允許把不限量的參數(shù)表示為一個(gè)數(shù)組（這一做法非常類似于原生JS中的arguments）:

看一下上述代碼片段，我們用一個(gè)參數(shù)LZB替換了之前的參數(shù)。你會(huì)注意到，參數(shù)LZB前面有一個(gè)三個(gè)點(diǎn)的省略號(hào)。一個(gè)剩余參數(shù)必須包含一個(gè)數(shù)組類型，否則就會(huì)出現(xiàn)編譯錯(cuò)誤。我們現(xiàn)在可以以任意數(shù)量的參數(shù)調(diào)用Add函數(shù):

雖然沒有具體的參數(shù)數(shù)量限制，理論上可以取數(shù)字類型的最大值。但實(shí)際上，這依賴于如何調(diào)用這個(gè)函數(shù)。
JavaScript函數(shù)有一個(gè)被稱為arguments的內(nèi)建對(duì)象，這個(gè)對(duì)象可以通過arguments局部變量取到。arguments變量是一個(gè)非常像數(shù)組的對(duì)象，包含了調(diào)用函數(shù)時(shí)的所有參數(shù)。（如果我們檢查JavaScript的輸出會(huì)發(fā)現(xiàn)，TypeScript遍歷arguments參數(shù)，以便將所有參數(shù)添加到foo變量中:）

對(duì)這個(gè)額外的針對(duì)函數(shù)參數(shù)的遍歷存在一些爭(zhēng)議。雖然難以想象這個(gè)額外的遍歷是否會(huì)成為一個(gè)性能瓶頸，但是如果你認(rèn)為這可能會(huì)對(duì)應(yīng)用程序帶來性能問題，應(yīng)考慮不使用剩余參數(shù)而是只使用一個(gè)數(shù)組作為函數(shù)參數(shù)。

上述代碼只有一個(gè)包含了number類型的數(shù)組。調(diào)用API會(huì)和剩余參數(shù)有一些不同，但是可以去除對(duì)函數(shù)參數(shù)列表進(jìn)行遍歷的操作:

函數(shù)作用域

一些低級(jí)語言（比如C語言）包含了底層內(nèi)存管理特性。在擁有更高層抽象的編程語言（比如TypeScript）中，當(dāng)變量被創(chuàng)建時(shí)，內(nèi)存就已經(jīng)被分配，并且在它們不被使用時(shí)會(huì)被清理掉。這個(gè)清理內(nèi)存的過程被稱為垃圾回收，由JavaScript運(yùn)行時(shí)的垃圾回收器實(shí)現(xiàn)。