TypeScript是一種由微軟開發的支持ES6標準的編程語言,它是Angular2的開發語言,是javascript的超集。TypeScript擴展了Javascript的語法,任何已
經存在的Javascript程序可以不加任何改動的在TypeScript的環境下運行。TypeScript只是向Javascript添加了一些新的遵循ES6規範的語法以及基於類
的面向對象編程的特性。它可以編譯成純Javascript,可以在任何瀏覽器,任何計算機和任何操作系統上運行,並且是開源的。
ES5 ES6 JavaScript TypeScript間的關係
ES是客戶端腳本語言的規範,ES5、ES6是這個規範不同的版本,JavaScript和TypeScript是兩種客戶端腳本語言,JavaScript實現了ES5規範,
TypeScript實現了ES6規範。
TypeScript相對於JavaScript的優勢
1. TypeScript支持ES6規範
ES6規範在2015年發佈,它指出了未來一段時間內客戶端腳本語言的發展方向。也就是說TypeScript語法在未來一段時間內將成爲客戶端腳本語言的主流語法。
2. 強大的IDE支持
強大的IDE支持主要體現在三個特性上:
<1>. 類型檢查:在TypeScript裏面是允許你爲變量指定類型的,比如聲明瞭一個字符串變量,那麼當我爲變量制定一個數字類型的值的時候,IDE會做出類型檢查,會告訴你這
裏可能有錯誤。這個特性會減少在開發階段犯錯誤的機率。
<2>. 語法提示:在IDE裏編寫TypeScript的代碼時,IDE會根據你當前所處的上下文把你能用的類、變量、方法和關鍵字都提示出來,我們只要直接去選就可以了。這個特性會
大大提高開發效率。
<3>. 重構:可以很方便的去修改你的變量、方法的名字或者是文件的名字。當我們做了這些修改的時候,IDE會自動幫你吧引用的變量或者調用這個方法的代碼自動幫你修改
掉。這個特性可以提高開發效率,提高代碼質量。
推薦WebStorm開發TypeScript程序,查看《使用WebSorm開發TypeScript的設置》。
3. Angular2的開發語言
最新的Angular2就是由TypeScript寫成的,所以熟悉TypeScript對學習Angular有很大幫助。
搭建TypeScript開發環境
有兩種主要的方式安裝TypeScript工具
- 通過npm(Node.js包管理器)
- 安裝TypeScript的Visual Studio插件
這裏只講述通過npm的方式安裝TypeScript:
1.安裝npm
$ curl http://npmjs.org/install.sh | sh
$ npm --v
4.4.1
2.安裝TypeScript npm包
$ npm install -g typescript
安裝完成後我們就可以使用 TypeScript 編譯器,名稱叫 tsc,可將編譯結果生成 js 文件。
要編譯 TypeScript 文件,可使用如下命令:
tsc filename.ts
一旦編譯成功,就會在相同目錄下生成一個同名 js 文件,你也可以通過命令參數來修改默認的輸出名稱。默認情況下編譯器以ECMAScript 3(ES3)
爲目標但ES5也是受支持的一個選項。TypeScript增加了對ECMAScript 6標準所建議的特性的支持。
創建Hello World示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Learning TypeScript</title>
</head>
<body>
<script src="js/hello.js"></script>
</body>
</html>
創建hello.ts文件,*.ts是TypeScript文件的後綴,向hello.ts文件添加如下代碼:
alert('hello world in TypeScript!');
接下來,打開命令行,使用tsc命令編譯hello.ts文件: