구조적 서브타이핑 / 잉여 속성 체크

아침에 유튜브 보면서 출근준비하다가

내가 의아해했던 부분을 설명해주셔서 안잊으려고 급하게 포스팅한다.

 

 

대체 무슨 기준으로 구조적 서브타이핑이 적용되고, 잉여 속성 체크가 적용되는 것일까?

 

여기서 구조적 서브타이핑은 상위와 하위의 개념으로, 상위의 개념이 하위를 포함하고 있는것이다.

구조적 서브타이핑에서는 하위가 다른 어떤 프로퍼티를 가지고 있는지 관심이 없다.

그저 상위의 프로퍼티만 가지고 있으면 된다.

 

 

하지만 잉여 속성 체크는 그에 반해 상위에 없는 프로퍼티를 가지면 에러를 발생시킨다.

 

 

 

 

이 둘의 발동 조건은 바로 객체 리터럴을 사용하냐, 사용하지 않느냐에 따라 나뉜다.

 

interface box {
	color: string;
}

// 잉여 속성 체크
box({
	color: "red",
    other: true
});


// 구조적 서브 타이핑
const obj = {
	color: "red",
    other: true
};


box(obj);

 

위 코드는 잉여 속성 체크를 이용하기 때문에 개발할때 저 other 가 문제가 될 것이다.

 

하지만 변수를 할당한 경우라면 구조적 서브타이핑 방식이 된다.

 

 

omgomg... 이 둘의 차이가 이제 명확해졌다!