[TypeScript]상표 기법

프로젝트를 진행하던 중 특정 배열의 길이가 0보다 크면(>0) 동작하는 조건문을 작성했습니다.

 

아래의 코드와 유사한 조건문이었는데요.

if (arr.length > 0) {
	// do something..
}

 

이 조건문에 대한 피드백이 있었습니다.

 

타입 검사와 런타임에서 발생하는 오류를 확인하는 상표 기법이라는 것이 있다!

 

피드백을 받고 상표 기법에 대해 학습할 내용이 이펙티브 타입스크립트에 있다고 하기에 학습을 진행했습니다.

 

상표 기법

예시 추가 예정

 

위의 예시를 보고는 객체에서만 쓰일 수 있는거 아닌가? 했었는데요.

 

그 중 저희 프로젝트에서 사용할 만하다고 판단한 예시가 있었습니다.

 

해당 예시

type AbsolutePath = string & {_brand: 'abs'};

const isAbsolutePath = (path:string): path is AbsolutePath => {
  return path.startsWith('/');
}

 

작성해본 코드

 

상표 기법에 따라 작성한 타입

type NotEmptyArray<T> = T[] & { _brand: 'not empty array' };

배열 길이 검사 로직

const isNotEmptyArray = <T>(array: T[]): array is NotEmptyArray<T> => {
  return array.length > 0;
};

 

isNotEmptyArray를 통과하고 true를 반환한다면 NotEmptyArray 타입으로 강제 형변환을 시키게 됩니다. 즉, 상표 기법은 타입 시스템에서 동작하지만 런타임에 상표를 검사하는 것과 동일한 효과를 얻을 수 있다는 것입니다.

---

이펙티브 타입스크립트에서는 객체에 _brand 키&프로퍼티를 넣어 사용하여 효과를 보았는데요. string에서도 사용하는 예시가 존재했기 때문에, 배열에도 적용할 수 있지 않을까해서 프로젝트에서 사용하고 있는 코드에 입혀보았습니다.

 

타입스크립트는 구조적 타이핑(덕 타이핑)을 사용하기 때문에, 값을 세밀하게 구분하지 못하는 경우가 있는데요. 값을 구분하기 위해 공식 명칭이 필요하다면 상표를 붙이는 것을 고려해야 한다고 하네요.

 

하지만, 현재로서는 많은 효능감을 얻지는 못하고 있습니다. 그래서 프로젝트에서 해당 부분을 기존의 로직으로 교체할까에 대한 고민이 있습니다만, 토스에서 작성한 아래의 문서로 더 학습을 하여 쓰임을 찾아보려 합니다.

https://toss.tech/article/typescript-type-compatibility

TypeScript 타입 시스템 뜯어보기: 타입 호환성

 

이만 글 줄이겠습니다. 읽어주셔서 감사합니다😄

---

참고

이펙티브 타입스크립트, 댄 밴더캄

https://toss.tech/article/typescript-type-compatibility