1. 程式人生 > 程式設計 >TypeScript 執行時型別檢查補充工具

TypeScript 執行時型別檢查補充工具

TypeScript是靜態型別系統,在編譯時做型別檢查。一般而言,如果專案所用到的所有庫、模組都是基於ts的,那麼靜態型別已經可以避免大部分程式設計層面的型別問題。不過,在一些場景下來,單純靜態型別是無法解決問題的,部分資料是動態傳入到系統中的,主要包含場景如下:

  • 第三方資料來源(介面API、本地持久化儲存、postMessage等)
  • 第三方呼叫者傳參
  • 全域性狀態變更

當然,還有其他可能,總之,單純靠靜態型別檢查,無法解決執行時型別問題。因此,我寫了tyshemo這個工具。它可以幫助我們完成執行時的型別檢查。它暴露了很多介面,其中的Ty介面,很適合在js中作為ts的補充被使用,我們來看下。

import { Ty } from 'tyshemo'

@Ty.decorate.with([Number,Number])
class Some {
 constructor(a,b) {
  this.x = a + b
 }
 
 @Ty.decorate.with(String)
 name = 'calc'
 
 @Ty.decorate.with([Number],Number)
 plus(y) {
  return this.x + y
 }
}

const some = new Some(1,3) // ok
const some2 = new Some('1','3') // throw error

some.name = 'ooo' // ok
some.name = 123 // throw error

const z = some.plus(2) // ok
const z1 = some.plus('3') // throw error

我們可以通過 Ty.decorate.with() 作為裝飾器來限定一個類上屬性的值型別,方法的引數和返回值型別。

在正常的程式中,我們有的時候也需要對值進行限定,但是由於js語言的特性,我們無法對基礎型別的值進行監聽,不過我們可以對object進行監聽。我們可以如下操作:

const o = process.env.NODE_ENV === 'production' ? {} : Ty.decorate({}).with({
 name: String,age: Number,})

o.name = null // throw error
o.name = 'aaa' // ok

o.age = '12' // throw error
o.age = 12 // ok

通過 process.env.NODE_ENV === 'production' 來控制當前環境,如果在正式環境,就不需要這個能力,畢竟我們在測試環境已經做過充分驗證了。

要對來自API的資料進行檢查,我們可以這樣操作。

function getData(url) {
 return fetch(url).then(res => res()).then((data) => {
  if (process.env.NODE_ENV !== 'production') {
   Ty.expect(data).to.be({
    name: String,})
  }
  return data
 })
}

Ty 這個介面可以快速對資料進行結構化檢查。tyshemo還有很多其他方面的能力,可以在它的文件中瞭解更多。

到此這篇關於TypeScript 執行時型別檢查補充工具的文章就介紹到這了,更多相關TypeScript 執行時型別檢查內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!