TypeScript 런타임 유형 확인 보충 도구

TypeScript는 정적 유형 시스템으로 컴파일할 때 유형 검사를 수행합니다.일반적으로 프로젝트에 사용되는 모든 라이브러리, 모듈이ts를 바탕으로 한다면 정적 형식은 대부분의 프로그래밍 차원의 형식 문제를 피할 수 있다.그러나 일부 장면에서 단순한 정적 유형으로는 문제를 해결할 수 없고 일부 데이터는 시스템에 동적으로 전송되며 주로 다음과 같은 장면을 포함한다.

제3자 데이터 원본(인터페이스 API, 로컬 지속화 저장소,postMessage 등)

제3자 호출자 전참

전역 상태 변경

물론 다른 가능성도 있다. 한마디로 정적 유형 검사만으로는 운행 시 유형 문제를 해결할 수 없다.그래서 나는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

우리는 타이를 통과할 수 있다.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

프로세스를 통과합니다.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,
    age: Number,
   })
  }
  return data
 })
}

Ty 이 인터페이스는 데이터를 신속하게 구조화 검사할 수 있습니다.tyshemo는 문서에서 더 많은 것을 알 수 있는 다른 능력이 있습니다.
TypeScript가 실행될 때 형식 검사 보충 도구에 대한 이 글은 여기에 소개되어 있습니다. 더 많은 TypeScript가 실행될 때 형식 검사 내용은 저희 이전의 글을 검색하거나 아래의 관련 글을 계속 훑어보십시오. 앞으로 많은 응원 부탁드립니다!