靜態型別檢測(flow, typescript)
靜態型別檢測
1.概念
先要分清楚,強類型和弱類型、靜態類型和動態類型是兩組不同的概念,類型強弱是針對類型轉換是否顯示來區分,靜態和動態類型是針對類型檢查的時機來區分。
靜態類型語言和動態類型語言得核心區別在於,靜態類型語言(statically-typed languages)會在編譯時(compile time)進行類型檢查,而動態語言(dynamically-typed)則是在執行時進行類型檢查(runtime)
例如java中,定義一個boolean值:
boolean result = true;
這個變數就有了一個正確的型別,因為boolean型別的宣告和這個變數給定的值是相符的。
在另一方面,如果你嘗試這麼來宣告這個變數:
boolean result =123;
由於變數result有一個錯誤的型別,因此會編譯失敗。因為我們在之前已經明確地聲明瞭result是一個boolean型別,所以這裡的整型值123賦給了它會報錯編譯失敗。
而在JavaScript和其他一些動態型別語言有著不同的處理方法,可以定義各種變量、方法、對象而不需要宣告它的類型。他們允許上下文環境來確定資料需要被定義為什麼型別,變數的型別是可以隨時改變的:
var result = true;
也就是說動態型別語言中的變數型別是被“隱去”的。
例如作為前端開發者,相信大家都
這就意味著,對於寫動態型別語言的程式設計師而言,即使程式碼中包含了會在執行時阻止指令碼正常執行的錯誤型別,這段程式碼也可以通過編譯。
在另一方面,如果一個寫靜態語言的程式設計師寫了一段包含了型別錯誤的程式碼,那麼除非修復這個錯誤,否則會一直編譯失敗。
2.靜態型別檢測的意義與好處
意義:靜態型別檢測有利於構建大型應用。
好處:
1.在大型應用中,由於js語言的特性,測試除錯分支覆蓋困難,很多程式碼並不能執行到,即會存在有些程式碼改動不會簡單的體現到UI層面上。而靜態型別檢測能做到即使編寫的程式碼沒執行到,在編譯階段即可發現程式碼中的型別不匹配。
2.靜態型別檢測是一種資料型別上的提示和規範。對閱讀程式碼和後期維護友好,資料格式直觀。
3. Typescript 與flow
正式因為js沒有靜態型別檢測,所以有些變數型別相關的問題只能在執行階段暴漏出來。為了解決這個問題,因此有了ts ,flow等工具庫。
Flow是Facebook開發和釋出的一個開源的靜態型別檢查庫,它允許你逐漸地向你的JavaScript程式碼中新增型別。可以在程式碼階段就檢測出對變數的不恰當引用。避免「undefined is not a function」之類的錯誤。而且由於類型固定了,在v8 上的執行效率會更高。
TypeScript是微軟出品的,一個會編譯為JavaScript的超集(儘管它看起來幾乎像一種新的靜態型別語言),這意味著,它使用起來會感覺和JavaScript很像,並不難上手。因為TS 提供了很多強類型語言的功能,所以可以使得代碼更健壯,編譯後的代碼也是針對V8 等js 引擎優化過的,所以執行效率也不會太慢。
不論是使用上面哪種工具,當你想要使用型別時,你會明確告訴工具哪個(些)檔案需要型別檢查。對於TypeScript,你需要將.js檔案拓展名改為.ts。對於Flow,你需要在檔案的頂部引入一段標註@flow。
一旦你聲明瞭想要對某一個檔案進行型別檢查,你需要使用他們各自的語法去定義型別。這兩個工具的一個區別在於,Flow是一個型別“檢查器”而不是一個編譯器。TypeScript則是一個編譯器。
有關flow 與typescript的語法,可參考官方文件自行學習。
Ts: http://www.typescriptlang.org/
3.1 搭配eslint ,tslint,語法規則和程式碼風格檢測
esLint 是外掛化的javascript 代碼檢測工具,它可以用於檢查常見的JavaScript 代碼錯誤,也可以進行代碼風格檢查,這樣我們就可以根據自己的喜好指定一套ESLint 配置,然後應用到所編寫的項目上,從而實現輔助編碼規範的執行,有效控制專案程式碼的質量。
Tslint和eslint工作方式相同,是檢查typescript的最好選擇。