반응형
250x250
Notice
Recent Posts
Recent Comments
Link
관리 메뉴

짧은코딩

string보다 구체적 타입 사용하기 본문

TS/이펙티브 타입스크립트

string보다 구체적 타입 사용하기

5_hyun 2023. 3. 29. 11:11

string 타입의 범위는 매우 넓다. string을 타입으로 선언하려면 더 좁은 타입이 있는지 확인해봐야 한다.

string을 남발한 설계

interface Album {
  artist: string
  title: string
  releaseDate: string // YYYY-MM-DD
  recordingType: string // E.g., "live" or "studio"
}

이 코드처럼 모두 string으로 선언하면 엉뚱한 값을 넣어도 타입 체커를 통과한다. 이렇게 string 타입이 남용된 코드는 문자열을 남발(stringly typed)했다고 한다. 더 좋은 타입 모델링을 하기 위해서는 타입의 범위를 좁혀서 선언해야 한다.

타입을 좁힌 설계

type RecordingType = 'studio' | 'live'

interface Album {
  artist: string
  title: string
  releaseDate: Date
  recordingType: RecordingType
}

이 코드처럼 날짜는 Date로 선언하고 recordingType는 2가지 중 하나만 들어갈 수 있기 때문에 유니온 타입으로 정의할 수 있다. 이렇게 하면 타입 체커는 타입을 더 정밀하게 체크할 수 있다.

타입을 좁히면 장점

1. 타입을 명시적으로 정의하여 다른 곳에 값이 전달되어도 타입 정보가 유지돤다.

/** 녹음한 장소  */
type RecordingType = 'live' | 'studio'

2. 타입을 명시적으로 정의하면 해당 타입을 의미하는 주석을 쓸 수 있다.

function pluck<T>(record: T[], key: keyof T) {
  return record.map(r => r[key])
}

3. keyof 연산자로 더욱 세밀하게 속성 체크가 가능하다. 객체의 속성 이름을 매개변수로 받으면 string보다 keyof T로 사용하는 것이 좋다.

정리

string과 any는 비슷한 문제를 가지고 있다. 잘못 사용하면 무효한 값을 허용하고 타입 간의 관계를 추론하기 어렵다. 이러면 타입 체커를 방해하고 버그를 찾기 어려워진다. 따라서 정확한 타입을 사용하려 해야 하며 이로 인해 오류를 방지하고 가독성을 향상할 수 있다.

 

 

728x90
반응형
Comments