1、什麼是typescript？
TypeScript是JavaScript的一個超集，擴充套件了JavaScript的語法，本質上向這個語言新增了可選的靜態型別和基於類的物件導向程式設計。任何現有的JavaScript程式可以不加改變的在TypeScript下工作,等同於ES時代的JS。TypeScript是為大型應用開發而設計，而編譯時它產生 JavaScript 以確保相容性。
2、JavaScript和typescript的區別？
TypeScript 可以使用 JavaScript 中的所有程式碼和編碼概念，TypeScript 是為了使 JavaScript 的開發變得更加容易而建立的。例如，TypeScript 使用型別和介面等概念來描述正在使用的資料，這使開發人員能夠快速檢測錯誤並除錯應用程式。
- TypeScript 從核心語言方面和類概念的模塑方面對 JavaScript 物件模型進行擴充套件。
- JavaScript 程式碼可以在無需任何修改的情況下與 TypeScript 一同工作，同時可以使用編譯器將 TypeScript 程式碼轉換為 JavaScript。
- TypeScript 通過型別註解提供編譯時的靜態型別檢查。
- TypeScript 中的資料要求帶有明確的型別，JavaScript不要求。
- TypeScript 為函式提供了預設引數值。
- TypeScript 引入了 JavaScript 中沒有的“類”概念。
- TypeScript 中引入了模組的概念，可以把宣告、資料、函式和類封裝在模組中。
3、為什麼使用TypeScript？
程式碼約束、提示能力
複製程式碼3.1程式碼約束
TypeScript 的型別機制可以有效杜絕由變數型別引起的誤用問題，而且開發者可以控制對型別的監控程度，是嚴格限制變數型別還是寬鬆限制變數型別，都取決於開發者的開發需求。
3.2程式碼提示
3.2.1程式碼的自動補全
TypeScript程式碼的提示功能會在您輸入字元的同時自動在游標的相應位置彈出。其提示列表是基於一定的順序排列，並非按照字母排列，如您在方法內部，觸發的提示，那形參會優先排列到前端。
3.2.2程式碼的著色
3.2.3程式碼的懸浮提示
您可以通過滑鼠觸碰某個方法、變數或類名等以快速獲得doc中對該目標的描述。
3.2.4方法引數和方法過載的提示
當您在輸入完一個方法的呼叫的時候，可以提示出該方法的引數，以及您當前馬上要輸入第幾個引數和相關引數的註釋資訊。同時，如果該方法被過載過，可以提示出每一次過載的提示。您可以通過鍵盤的上下方向鍵來進行切換檢視。
3.2.5 程式碼的格式化
格式化的相關配置，如方法明後是否換行等，您可以通過如下途徑進行設定。
開啟選單：視窗->首選項（偏好設定->首選項）。
3.2.6 程式碼的引用高亮
當您選擇一個變數或者方法的時候，編輯器可以即時的提示您在當前的TypeScript檔案中所有對當前選擇內容的引用。
3.2.7即時錯誤提示
在您正在輸入TypeScript程式碼的同時，可以幫助您及時發現程式碼中的語法語義等錯誤部分，並有效提示出所在行，以便能夠快速對書寫問題進行修改。
3.2.8查詢引用和宣告
此功能可以方便的查詢某一個類、方法或變數在整個專案中的引用，並且可以通過搜尋皮膚直接開啟相關的TypeScript檔案並選中相應程式碼。您可以通過 如下方式進行引用和宣告的查詢：右鍵點選某一段程式碼，在彈出選單中選擇查詢引用或查詢定義。
4、新增特性的語言擴充套件
4.1 類（Classes）
類是TypeScript的核心，使用TypeScript開發時，大部分程式碼都是寫中類裡面的。
4.2介面 Interfaces
提供的 interface 介面這個功能在開發專案的時候會很有幫助，用來建立某種程式碼約定，TypeScript的核心原則之一是對值所具有的結構進行型別檢查。在TypeScript裡，介面的作用就是為這些型別命名和為你的程式碼或第三方程式碼定義契約。
IPerson 介面就好比一個名字，它代表了有 name 屬性且型別為 string 和age屬性且型別為number的物件。只要傳入的物件滿足上述必要條件，那麼它就是被允許的。
帶有可選屬性的介面與普通的介面定義差不多，只是在可選屬性名字定義的後面加一個 ? 符號。可選屬性的好處之一是可以對可能存在的屬性進行預定義，好處之二是可以捕獲引用了不存在的屬性時的錯誤。
要注意可選引數沒傳的情況，必選引數不能放在可選引數後面。
4.3模組 Modules
模組可以幫助開發者將程式碼分割為可重用的單元。開發者可以自己決定將模組中的哪些資源（類、方法、變數）暴露出去供外部使用，哪些 資源只在模組內使用。 在TS中一個檔案就是一個模組，中模組的內部有兩個關鍵字（export、import）支撐模組的特性。這兩個關鍵字來控制模組對外暴露什麼、需要別的模組對你提供什麼。
4.4型別註解 Type annotations
對於基本型別的批註是 number, bool 和 tring。而弱或動態型別的結構則是 any 型別。當型別沒有給出時，TypeScript編譯器利用型別推斷以推斷型別。如果由於缺乏宣告，沒有型別可以被推斷出，那麼它就會預設為是動態的any型別。
4.5編譯時型別檢查 Compile time type checking
編譯時對變數的型別進行檢查，符合要求的繼續編譯，不符合要求的報錯。
4.6箭頭表示式
表示式 ()=>{something}或()=>something 相當於js中的函式,它的好處是可以自動將函式中的this附加到上下文中，消除this的指向問題。
5、常見問題
5、1基礎型別any
有時候，我們會想要為那些在程式設計階段還不清楚型別的變數指定一個型別。 這些值可能來自於動態的內容，比如來自使用者輸入或第三方程式碼庫。 這種情況下，我們不希望型別檢查器對這些值進行檢查而是直接讓它們通過編譯階段的檢查。 那麼我們可以使用 any型別來標記這些變數。
5.2 var let const 區別
var：使用var宣告的變數，其作用域為該語句所在的函式內，且存在變數提升現象（函式及變數的宣告都將被提升到函式的最頂部）
let：用let宣告的變數，其作用域為該語句所在的程式碼塊內，不存在變數提升；
const: 使用const宣告的是常量，與let宣告相似，但是就像它的名字所表達的，它們被賦值後不能再改變。 換句話說，它們擁有與 let相同的作用域規則，但是不能對它們重新賦值。
5.3剩餘引數
必要引數，預設引數和可選引數有個共同點：它們表示某一個引數。 有時，你想同時操作多個引數，或者你並不知道會有多少引數傳遞進來。可以把所有引數收集到一個變數裡，剩餘引數會被當做個數不限的可選引數。 可以一個都沒有，同樣也可以有任意個。編譯器建立引數陣列，名字是你在省略號（ ...）後面給定的名字。
5.4 for . . of 與 for . . in
for . . of和for..in均可迭代一個列表；但是用於迭代的值卻不同，for..in迭代的是物件的 鍵 的列表，而for..of則迭代物件的鍵對應的值。
6、React專案中tsconfig.json詳解
如果一個目錄下存在一個tsconfig.json檔案，那麼它意味著這個目錄是TypeScript專案的根目錄。tsconfig.json檔案中指定了用來編譯這個專案的根檔案和編譯選項。
`{ "compilerOptions": { "outDir": "./dist/“, //重定向輸出，打包輸出路徑
"sourceMap": true, //生成相應的 .map檔案
"allowSyntheticDefaultImports": true, //允許從沒有設定預設匯出的模組中預設匯入
"experimentalDecorators": true, //修飾符
"moduleResolution": "node”, //決定如何處理模組
"declaration": false, //生成相應的 .d.ts檔案
"target": "es6”, //指定ES的目標版本
"jsx": “react” //在 .tsx檔案裡支援JSX
複製程式碼},
"exclude": [ "node_modules" ],
"include": [ "src/**/*" ] }` "exclude"和"include"屬性指定一個檔案glob匹配模式列表。
支援的glob萬用字元有：
匹配0或多個字元（不包括目錄分隔符）
? 匹配一個任意字元（不包括目錄分隔符）
**/ 遞迴匹配任意子目錄
複製程式碼參考文件： https://baike.baidu.com/item/typescript/4314718?fr=aladdin 簡書 https://www.jianshu.com/p/c5005fad4274
菜鳥教程 https://www.runoob.com/w3cnote/getting-started-with-typescript.html
提示能力 http://edn.egret.com/cn/docs/page/941
https://www.cnblogs.com/langzianan/p/8403332.html