[TypeScript] 객체 타입의 호환성

🥐 객체 타입의 호환성

모든 객체 타입은 각각 다른 객체 타입들과 슈퍼-서브 타입 관계를 갖는다. 

따라서 업 캐스팅은 허용하고 다운 캐스팅은 허용하지 않는다.

type Animal = {
    name:string;
    color:string;
};

type Dog = {
    name:string;
    color:string;
    breed:string;
};

let animal:Animal = {
    name: "기린",
    color: "yellow",
};

let dog:Dog ={
    name: "만복이",
    color: "white",
    breed: "진도",
};

// 업캐스팅
animal = dog;

// 다운 캐스팅
dog = animal // ❌

Animal 타입의 변수 animal에 Dog 타입의 변수 dog를 할당하는 것은 가능하지만 반대는 불가능하다. 이는 Animal 타입이 Dog 타입의 슈퍼 타입이기 때문이다.

 

Dog타입이 더 많은 프로퍼티를 정의하고 있는데 왜 슈퍼 타입이 아닐까?

 

객체 타입은 프로퍼티를 기준으로 관계를 정의한다.

타입스크립트는 프로퍼티를 기준으로 타입을 정의하는 구조적 타입 시스템을 따른다. 

따라서 Animal 타입은 name과 color 프로퍼티를 갖는 모든 객체들을 포함하는 집합으로 볼 수 있고 Dog 타입은 name과 color에 추가로 breed 프로퍼티를 갖는 모든 객체를 포함하는 집합으로 볼 수 있다. 그러므로 Dog 타입에 포함되는 객체는 무조건 Animal 타입에도 포함되지만 그 반대는 포함되지 않는다. 때문에 Animal은 Dog의 슈퍼 타입이 된다.

 

 

🥐 초과 프로퍼티 검사

변수를 객체 리터럴로 초기화할 때 발동하는 타입스크립트의 특수한 기능

type Book = {
   name:string;
   price:number; 
};

type ProgrammingBook = {
    name:string;
    price:number;
    skill:string;
};

let book:Book;
let programmingBook:ProgrammingBook = {
    name: "한 입 크기로 잘라먹는 리액트",
    price: 33000,
    skill: "reactjs",
}

// 업캐스팅
book = programmingBook;

let book2:Book = {
    name: "한 입 크기로 잘라먹는 리액트",
    price: 33000,
    skill: "reactjs", // ❌ Book형식에 skill 프로퍼티가 존재하지 않음
}

Book 타입으로 정의된 변수에 ProgrammingBook 타입을 업캐스팅한 것은 되지만 book2변수에 ProgrammingBook 타입의 초기값을 설정하면 오류가 발생하는 이유는 초과 프로퍼티 검사 때문이다.

초과 프로퍼티 검사는 타입에 정의된 프로퍼티 외의 다른 초과된 프로퍼티를 갖는 객체를 변숭에 할당할 수 없도록 막기 때문에 Book 타입에 존재하지 않는 skill 프로퍼티를 사용하면 오류가 난다.

 

그렇다면 업캐스팅은 왜 이 검사가 발생하지 않는 걸까?

초과 프로퍼티 검사는 단순히 변수를 초기화할 때 객체 리터럴을 사용하지만 않으면 발생하지 않는다. 따라서 값을 별도의 다른 변수에 보관한 후 변수 값을 초기화 값을로 사용하면 발생하지 않는다.

 

 

초과 프로퍼티 검사는 함수의 매개변수에도 동일하게 발생한다.

function func(book:Book){};
func({
    name: "한 입 크기로 잘라먹는 리액트",
    price: 33000,
    skill: "reactjs", // ❌ 
})

// 변수를 넣으면 발생하지 않음
func(programmingBook)

 

---

🔗 타입스크립트 강의

한 입 크기로 잘라먹는 타입스크립트 - 인프런 | 강의