[타입스크립트 입문 - 기초부터 실전까지] 타입 호환

EJ·2020년 11월 26일
0

Typescript

목록 보기
16/25
post-thumbnail

타입 호환(Type Compatibility)

타입 호환이란 타입스크립트 코드에서 특정 타입이 다른 타입에 잘 맞는지를 의미한다.

interface Ironman {
  name: string;
}

class Avengers {
  name: string;
}

let i: Ironman;
i = new Avengers(); // OK, because of structural typing

타입 호환 예제 - 인터페이스, 클래스

타입호환은 기본적으로 오른쪽에 있는 타입이 더 많은 속성을 가지거나 구조적으로 더 컸을 때 왼쪽과 호환이 된다.
즉, 구조적으로 더 큰 타입에서는 작은 타입을 지원할 수 없는 것이 타입호환이다.

// 인터페이스
interface Developer {
    name: string;
    skill: string
}
interface Person {
    name: string;
}
var developer: Developer;
var person: Person;
developer = person; // 우측에 위치한 person이 developer보다 속성이 더 적기 때문에 에러가 난다.
person = developer; // 오른쪽에 위치한 developer가 구조적으로 더 큰 타입이기 때문에 person을 지원할 수 있다. 호환이 된다.
// 클래스
interface Developer {
    name: string;
    skill: string
}
class Person {
    name: string;
}
var developer: Developer;
var person: Person;
developer = new person();

타입호환을 통해 타입 스크립트에서 코드 간에 서로 타입이 맞는지 확인할 때는 타입별칭, 인터페이스, 클래스로 확인하는 것이 아니라, 내부적으로 존재하고 있는 속성과 타입에 대한 정의들에 대해 비교한다.


타입 호환 예제 - 함수, 제네릭

제네릭

interface Empty<T> {
    // ..
}
var empty1: Empty<string>;
var empty2: Empty<number>;
empty1 = empty2;
empty2 = empty1;
  • Empty인터페이스의 내부 구조가 비어있기 때문에 empty1, empty2가 서로 호환이 가능한 상태이다.

구조적으로 제네릭에 의해 인터페이스 안의 값이 바뀌는 경우를 살펴보자.

interface NotEmpty<T> {
    data: T,
}
var notempty1: NotEmpty<string>;
var notempty2: NotEmpty<number>;
notempty1 = notempty2;
notempty2 = notempty1;
  • NotEmpty인터페이스의 내부에 data가 존재하고 제네릭에 의해 타입이 정해진다.
  • 따라서, notempty1, notempty2의 구조적인 타입의 차이가 생기기 때문에 서로 호환이 되지 않는다.


💡 참고

profile
주니어 프론트엔드 개발자 👼🏻

0개의 댓글