---
# System prepended metadata

title: TypeScript 環境安裝
tags: [TypeScript]

---

# TypeScript 簡介 與 環境安裝

## 優點
TypeScript 增加了程式碼的可讀性和可維護性
* 型別系統實際上是最好的文件，大部分的函式看看型別的定義就可以知道如何使用了
* 可以在編譯階段就發現大部分錯誤，這總比在執行時候出錯好
* 增強了編輯器和 IDE 的功能，包括程式碼自動完成、介面提示、跳轉到定義、重構等
* 
TypeScript 非常包容
* TypeScript 是 JavaScript 的超集，.js 檔案可以直接重新命名為 .ts 即可
* 即使不顯式的定義型別，也能夠自動做出型別推論
* 可以定義從簡單到複雜的幾乎一切型別
* 即使 TypeScript 編譯報錯，也可以產生 JavaScript 檔案
* 
相容第三方函式庫，即使第三方函式庫不是用 TypeScript 寫的，也可以編寫單獨的型別檔案供 TypeScript 讀取
* TypeScript 擁有活躍的社群
* 大部分第三方函式庫都有提供給 TypeScript 的型別定義檔案
* Google 開發的 Angular2 就是使用 TypeScript 編寫的
* TypeScript 擁抱了 ES6 規範，也支援部分 ESNext 草案的規範
---
## TypeScript 的命令列工具安裝方法如下：

1. 安裝 TypeScript 
以下命令會在全域性環境下安裝 tsc 命令，安裝完成之後，我們就可以在任何地方執行 tsc 命令了。
```
npm install -g typescript
```
2. 新增專案資料夾後，打開終端機輸入指令進行初始化
```
tsc --init
```
以上命令會在全域性環境下安裝 tsc 命令，安裝完成之後，我們就可以在任何地方執行 tsc 命令了。

3. 新增 hello.ts，寫入 let sayHello: string = 'Hello World！';

> 使用 TypeScript 編寫的檔案以 .ts 為字尾，用 TypeScript 編寫 React 時，以 .tsx 為字尾。

4. 編譯一個 TypeScript 檔案很簡單：
* tsc hello.ts 單獨手動編譯
* tsc --watch 持續性自動監控編譯
```
tsc hello.ts
```
我們約定使用 TypeScript 編寫的檔案以 .ts 為字尾，用 TypeScript 編寫 React 時，以 .tsx 為字尾。

