본문 바로가기

Language/JS, TS

[Typescript] 구조적 타이핑

[구조적 타이핑]

Typescript 의 타입 호환성은 구조적 타이핑을 지원합니다. 여기서 구조적 타이핑이란 X 와 Y 라는 타입이 '구조적' 으로 동일하다면 X 와 Y 는 호환 가능한 타입이 될 수 있다고 여길 수 있는 것을 의미합니다.

interface A {
  id : number
}

interface B {
  id : number 
}

let a : A;

let b : B = {
  id: 5,
}

a = b //OK

a는 A 타입 으로 선언되었지만 '구조적'으로 동일한 B 타입의 객체를 대입하더라도 에러를 내지 않습니다. 

interface A {
  id : number
}

interface B {
  id : number 
  name : string 
}

let a : A;

let b : B = {
  id: 5,
  name: 'june'
}

a = b //OK

 B 타입에는 A 타입에 없는 name 속성이 있지만 해당 코드도 문제없이 실행됩니다. 예시처럼 id : number 라는 속성을 가지기만 하면 이외에 추가적인 속성을 가지더라도 A 타입이 될 수 있는 것입니다. 이 또한 구조적 타이핑의 한가지 특징입니다. 

a.name //Error

 하지만 위처럼 추가적인 속성에 직접 접근하려고하면 에러가 발생합니다. 구조적 타이핑의 관점에서 B는 A의 서브 타입이 되지만, A 타입으로 선언된 a 변수에 'name' 속성이 있는지 타입체커가 확신할 수 없기 때문입니다. 

 

const a : A = {
  id: 1,
  name: 'a' //error
}

 또한 위 처럼 타입 '선언'을 해준 뒤 추가적인 속성을 지정하려고하면 A 라는 타입에는 원래 name 이라는 속성이 없기 때문에 타입 체커는 에러를 발생시킵니다. (에러를 발생 시키지 않으려면 '타입 선언' 대신 '타입 단언' 을 사용하면 됩니다. 하지만 타입 단언은 타입체커를 무력화시킬 가능성이 있기 때문에 특별한 경우를 제외하고 권장하지 않습니다.)

 

이외에도 함수, 열거형, 클래스 등 다른 언어와는 다른 타입 호환 메커니즘이 있으니 아래 링크를 꼭 확인해주시길 바랍니다. 

 

타입스크립트의 타입 호환성이 더 궁금하다면?

 

'Language > JS, TS' 카테고리의 다른 글

Array.from()  (0) 2022.07.07
[Error] tsconfig.json: Build:No inputs were found in config file  (0) 2022.06.15