為什么選擇Typescript


上一節,我簡單介紹了Typescript,並將Typescript和JavaScript進行了對比,有些網友提出了一些疑問,可能有些網友對於這個Typescript還不是特別的熟悉,這節,我做一些演示。

1.安裝Typescript

Google Search Typescript,找到Typescript的下載安裝包,我這次下載的0.9.0.1版本,安裝圖片:

安裝過程非常迅速,一分鍾搞定。

 

2.測試看是否安裝成功,打開命令窗口(win+R),輸入cmd ,命令窗口打開,輸入tsc,你會看到相關的Typescript命令行,表明已經安裝成功了。有些命令還是挺有用的

tsc -v 查看版本號

tsc C:\aa.ts D:\bb.js 將C盤下的aa.ts 編譯並生成JavaScript file輸出到D盤,名字為bb.js

tsc C:\typescripts\*.ts D:\all.js 這個就更有用了對不對?對Typescript合並輸出一個js file

...

有些大家自己試試就知道了。。

 

3.用visual studio 演示下Typescript

新建一個工程

可以看到系統默認提供了相應的文件,將app.ts 里面內容全部刪除掉,我們自己寫一個

上圖我簡單介紹下幾個關鍵字:

module:類似Java package 或者C# namespace的概念,一個module里面的任何變量的聲明不會對另外一個module產生影響,那么尤其在做大型web項目,這個實在是太重要了。

export:類似任何面向對象語言里面的public,表明這個是個共有方法。

上圖中,更有意思的是,我聲明了兩個private變量,智能提示對於我們的書寫,提高了效率。我們繼續

我們看到這個圖片中,有紅色的波浪線,而且有錯誤提示說,不能把string賦值給數值類型,這就是所謂的編譯器,可以把我們的一大部分錯誤給屏蔽掉,提升我們的代碼質量和效率,試想在弱類型的JavaScript中,var a=0 和var a=“0”,誰能告訴我哪個對哪個錯誤??在這樣的代碼存在很久之后,又有誰能告訴我,a到底是返回數值,還是返回字符串。

我們在寫JavaScript的時候,還經常會遇到該變量名字或者方法名字的時候,在Visual studio中,可以簡單做到這一步(上圖演示),我覺得其他的IDE也應該支持這個,畢竟Typescript是開源的。但是這個我並沒有測試,sorry。

下面我在對比下,ts 和js file的代碼量,大家都懂得,無論是代碼的層次結構,還是代碼量上面,誰有更明顯的優勢呢?

 

我就把這個demo做完吧。其實我就是結單寫了個計數器,下面是html啟動頁面的代碼:

大家看到了么?這里面沒有包含任何Typescript的文件,Typescript在整個application中,充當的是語法糖的角色,其實就是一名很靠得住的翻譯。

啟動,點擊button按鈕,計數器不斷累加,程序非常簡單,勿噴,但是這些足以說明Typescript的強大之處,謝謝微軟。

 

上次我的博文,有些人問我,憑什么我說它是Teamwork的利器?

    我們的計算機語言,由以前的面向過程的語言,慢慢的演變現在非常流行的OOP,基本上可以說,現在的主流語言都已經支持面向對象(Java,C++,C#等等),JavaScript是一門挺古老的語言,但是到現在也是盛行不衰,尤其現在Html5的流行,但是它本身有致命的弱點,就是弱類型,而且它沒有package,class,interface,extends,generics等概念,導致它實現不了面向對象那些優勢,但是Typescript的出現,終於把這些問題解決了,Typescript把面向對象的種種概念統統都支持了,對於尤其喜歡面向對象語言編程的大牛們,Typescript是個非常不錯的選擇。

 

    之所以叫Teamwork,說明每個人對這個Team都有貢獻,當然也有影響,代碼質量的提高,除了自己的code經驗,另外更重要的的一點就是工具,有些繁瑣難做,而且容易導致錯誤的功能,為什么不選擇交給機器呢?如果我們的code coverage100%,UnitTest 100% pass,那么我的質量得有多高啊?首現前提,自己的代碼要讓機器認識,是不是?如果code在編譯階段都出不了warning or error,那么你會把 Tester給累死的。這里說多了,我會選擇個合適的時間講下 CI 和 CD。如何提升Team的效率。

Typescript 團隊合作的利器

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM