HelloType：JS運行時數據類型檢查工具

進入GitHub主頁
使用文檔

HelloType是一個api設計簡單的js運行時的數據類型檢查工具，它能夠幫助你的js程序在使用某個（組）變量前，對變量的數據類型進行檢查，防止在使用變量進行運算時因爲數據類型不一樣致使報錯。

雖然咱們已經有typescript，可是它只能在編譯時進行靜態數據類型檢查，而不能進行動態的運行時數據檢查。而HelloType就是想補充這個空缺。它的使用方法很是簡單，api設計很是容易理解，而且語義化。

解除API數據格式煩惱

前端經過讀取後端接口返回的數據進行界面渲染，可是常常碰到的問題是，前端對後端數據無比信任，按照你們約定的格式讀取數據，可是，忽然有一天深夜，監控系統忽然報警，南非的大老闆進去頁面後不斷產生錯誤。做爲有修養的程序員，果斷cmd+opt+I打開開發者工具，一看，一堆紅色報錯，就像心臟滴血。通過一整夜的奮戰，最後發現，原來是後端發佈了新版本，在一個關鍵接口的返回數據中，統一將數值型的返回值修改爲了字符串的數字。心裏一陣MMP以後，你如今終於有了HelloType。

圖：經過hello-type提供的方法，建立具備必定格式的數據結構

當你使用HelloType建立了一個特定的數據結構容器以後，利用這個容器，和接收到的API數據進行對比，就能夠知道API返回的數據格式是否符合本地規定的格式，數據節點上的數據類型是不是規定的數據類型。一旦API返回的數據格式、類型不符合要求，你就能夠追蹤到這個錯誤，而且把錯誤發送到你的監控系統，而且通知後端同窗「大家改數據類型不通知下游團隊，是要藥丸嗎？」

檢查函數的輸入輸出

TypeScript是前端語言的一次升級，然鵝，它只在編譯時對項目內的數據類型作檢查，而沒法作到運行時的類型檢查。除了api的數據是不可測的之外，用戶輸入的數據也不可測，你還會用第三方庫吧，或者你本身如今就在寫一個第三方庫，但凡跨項目的代碼，就會有不可測的數據類型。爲了學習TypeScript的接口、範型，你大刀闊斧的改項目代碼，最後上線了，看看監控系統，心裏MMP……

圖：利用ES7裝飾器，快速對某個方法的輸入輸出的數據類型進行限制

若是你和我同樣超級懶不想爲了編寫一大堆接口、範型、類型寫一大堆和業務自己無關的ts代碼時，HelloType給你直觀的感覺，並且完徹底全是ES語法，不帶半點地方方言。

靜靜地追蹤數據類型錯誤

對業務代碼的大舉侵入是最討厭的是，對於個人應用而言，已經作好了程序報錯時的萬全準備，那就是——提示用戶系統出錯了！！既然這樣，HelloType能夠幫助你收集數據類型錯誤，讓你的代碼作一段安靜的代碼。

圖：利用一個全局函數，抓取錯誤信息，並將錯誤信息經過ajax請求上傳到服務器

HelloType中到trace方法徹底異步，完全的異步執行，不影響界面的渲染，在追蹤到數據類型報錯以後，異步執行with方法中的函數，這個函數是自定義的，所以你能夠在這個函數裏面作任何事情，但它是異步的，你能夠收集日誌，而後上傳到監控系統，幹得漂亮。

兼容模式和嚴格模式

HelloType默認是兼容模式對數據進行檢查的，所謂兼容模式嚴格模式，主要是針對數組和對象而言。兼容模式下，一個被檢查的對象若是屬性比規定的要多，並不會報錯，只要規定的那部分屬性數據類型檢查沒報錯便可。嚴格模式下，數組的元素個數必須和規定的同樣，不能多也不能少，即便IfExists，也會被忽略，必須遵照嚴格模式。對象的話，主要是屬性必須和規定的相同，不能多也不能少，IfExists也同樣被忽略。

圖：因爲多了height屬性，會報錯。經過strict屬性獲取一個類型容器的嚴格模式狀態，對結構比較嚴格要求的狀況很是有用

另外，還有一個方法能夠開啓嚴格模式：toBeStrict()。它直接改變當前容器爲一個嚴格模式的容器。在必要的時候使用它會讓代碼顯得很精煉。例如：

const SomeType = Dict({
  body: Dict({ name: String }).toBeStrict(), // 使用Dict直接做爲規則的時候，因爲只會在這裏用到一次，因此直接調用toBeStrict()比較好
})

小結

JS的數據類型自己的混亂對於開發者而言，簡直就是噩夢，可是HelloType讓你能夠睡個好覺。經過很是合理的代碼佈局，讓你能夠很是優秀的攔截因爲數據類型問題產生的bug。並且，因爲它是基於Error，因此調試起來很是方便，對於監控而言也很是有利，利用它，能夠收集具體的錯誤數據，上報到服務端，由服務端對本身輸出的數據格式和類型進行糾正。

開始使用

本文原載於 https://www.tangshuang.net/he...若是你以爲這個想法還不錯，github上給個star吧😊