介紹:
TypeScript是JavaScript的超集,擴展了JavaScript的語法,因此現有的JavaScript代碼可與TypeScript一起工作無需任何修改,TypeScript通過類型注解提供編譯時的靜態類型檢查。其源於JavaScript(JS的拓展),終於JavaScript(編譯成JS)
TypeScript 起源於使用JavaScript開發的大型項目 。由於JavaScript語言本身的局限性,難以勝任和維護大型項目開發。因此微軟開發了TypeScript ,使得其能夠勝任開發大型項目。
環境安裝:
首先安裝node與npm,參考這篇文章
打開cmd,運行以下命令安裝TypeScript
npm install -g typescript
安裝完成后輸入 tsc -v 查看安裝是否成功,然而有時會碰上下圖問題,系統禁止執行腳本
首先輸入get-ExecutionPolicy來獲取是否允許腳本執行狀態,顯示Restricted說明腳本不被允許執行,此時我們輸入 set-ExecutionPolicy RemoteSigned即可
網上還有一種方式是刪除ts依賴下的tsc.ps1文件,親測有效,副作用尚未發現
IDE推薦:
微軟官方的Visual Studio Code(簡稱VS Code):做開發以來使用的最舒服的輕量級IDE,支持ts開發,之前用的sublime和atom總感覺缺點什么,這款編輯器插件豐富,界面簡潔,如今支持配置同步,讓開發得心應手
JetBrains公司旗下的WebStorm:作為一款重量級web編輯器,功能可以說是非常齊全,在編輯ts時可以配置自動編譯,如果說VScode輕量簡潔開發舒服,Webstorm可以說是功能強大,專為web開發而生的神器
開發與運行:
以VS-Code為例:
在目錄下新建app.ts文件,輸入以下代碼
class HelloWorld {
constructor() { }
say() {
console.log('hello world')
}
}
new HelloWorld().say()
將cmd打開於當前目錄下,輸入tsc app.ts或者簡寫tsc app,ts會編譯一個app.js文件生成在目錄下,編譯結果如下
var HelloWorld = /** @class */ (function () {
function HelloWorld() {
}
HelloWorld.prototype.say = function () {
console.log('hello world');
};
return HelloWorld;
}());
new HelloWorld().say();
這就是我們熟悉的JS原生代碼,我們使用node app.js或者簡寫node app執行app.js,控制台會輸出hello world
然而每次都需要編譯ts並在node執行調試有點麻煩,這里推薦一個插件ts-node,在cmd中全局安裝依賴
npm i ts-node -g
安裝完成之后在cmd中執行 ts-node app,會直接編譯並在node中執行,打印hello world(注意:該操作不會生成app.js文件,而是直接自動編譯直接執行)
當然,在webstorm中,打開設置,將TS的自動編譯打開,也會節省不少事
總結:
以上就是TypeScript起步的介紹,環境安裝與運行及注意事項