초보 개발자의 성장 일기

[TypeScript] 타입 대입시 주의점 본문

Development/TypeScript

[TypeScript] 타입 대입시 주의점

YUNA 2024. 2. 23. 21:43

타입을 작성할 때 한가지만 작성하는 경우도 있지만,

보통은 |을 사용해서 다양한 타입을 지정할 수도 있다.

 

type A = string | number; // 넓은 타입
type B = string; // 좁은 타입
type C = string & number; // 제일 좁은 타입

|을 사용하면 또는 이라는 의미로 사용한 모든 타입이 가능하고 넓은 타입이다.

타입을 하나만 작성한 경우는 |을 사용한 경우보다는 좁은 타입이고,

&를 사용하면 둘다 가능해야 하므로 제일 좁은 타입이 된다.

타입의 너비는 A > B > C 순이고 좁은 타입에서 넓은 타입으로 대입이 가능하다.

 

 

타입을 보고 좁은 타입인지 넓은 타입인지 구분할 수 있어야 한다.

 

 

type A = { name: string };
type B = { age: number };
type AB = A | B; // 제일 넓은 타입

type C = { name: string; age: number };
type C = A & B;

여기서는 타입 AB가 넓은 타입이고 타입 C가 좁은 타입이다.

타입이 구체적일수록 좁은 타입이 된다.

 

const cc: C = { name: 'zerocho', age: 29, married: false };

married라는 속성을 추가하게 되면 오류가 나는데 넓은 타입에서 좁은 타입 대입시 에러가 생긴다.

객체의 리터럴을 바로 대입하면 잉여 속성검사로 추가적인 검사를 하나 더 하게 되고 에러가 생긴다.

 

다른 방법으로 해결이 가능하다.

const object = { name: 'zerocho', age: 29, married: false };
const c: C = object;

변수를 선언하고 타입 지정한 다른 변수에 대입하면 된다.