instanceof 관련 질문

한 입 크기로 잘라먹는 타입스크립트(TypeScript)

타입 좁히기

작성

104

안녕하세요!

다름이 아니라 타입 좁히기 도중 type Person을 어떻게 해야
instanceof와 같이 쓸까 고민 중 아래와 같이 직접 인스턴스를 만들어 봤습니다.

class IPerson {
    constructor(public name: string, public age: number) {}
}
func (new IPerson("User", 36));

위 처럼 작성 시 정상작동은 하더라구요.

instanceof에 관해 조금 더 찾아보니 보통 interface와 같이 사용한다 하여 기존 Person 타입도

interface Person {
  name: string;
  age: number;
}

위처럼 바꿔주었는데요. 실수로 제가 age: number; 부분을 지우고 파일을 실행 시켰는데도 불구하고 정상적으로 "User은 36살 입니다." 라고 출력이 되더라구요.

궁금해서 더 찾아보니 instanceof는 생성자를 기준으로 판단한다고 하였는데,

여기서 제가 궁금한 것은 instanceof는 타입 별칭과 별개로 생성자를 기준으로 판단하면 value instanceof IPerson 부분에
value의 타입은 Person이 아닌 IPerson으로 좁혀져야 하는게 아닌지 궁금합니다!!

typescript

답변 2

이정환 Winterlood

지식공유자

안녕하세요 이정환입니다.

죄송하지만 질문을 제가 정확히 이해하지 못했어요 ㅠㅠ 혹시 궁금한 점을 전체 코드와 함께 올려주실 수 있을까요?

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다. 초보고양이발자님.

질문 주셔서 감사합니다! instanceof와 관련된 혼란스러운 부분에 대해 설명드리겠습니다.

instanceof는 실제로 객체가 특정 클래스의 인스턴스인지를 확인하는 연산자입니다. 즉, 타입스크립트에서 instanceof는 런타임 시점에 객체의 프로토타입 체인을 따라가면서 해당 객체가 특정 클래스의 인스턴스인지 확인합니다. 이를 위해서는 생성자 함수가 필요합니다.

여기서 중요한 점은 instanceof는 인터페이스나 타입 별칭이 아닌, 클래스나 생성자 함수와 함께 사용된다는 것입니다. 따라서 instanceof는 타입스크립트에서 타입 체커에 의해 컴파일 타임에 다른 타입 해석을 제공하는 것이 아니라, 런타임에 체크되기 때문에 Person 대신 IPerson으로 좁혀져야 한다는 것이 맞습니다. 하지만 타입스크립트는 인터페이스를 자바스크립트로 컴파일할 때에는 어떤 코드를 생성하지 않으며, 이는 instanceof와는 호환되지 않습니다.

즉, instanceof는 클래스(또는 생성자)가 있는 경우에만 작동하며, 타입 체커는 여전히 타입 체커로 존재합니다. 따라서 코드에서 value instanceof IPerson 을 사용하면 value는 자바스크립트 런타임에서 IPerson 클래스의 인스턴스로 인식되며, 타입스크립트 타입 체커는 IPerson을 기준으로 추측하게 됩니다.

이와 관련하여 더 깊은 이해를 돕기 위한 기존 설명을 확인하실 수 있는 링크를 알려드립니다:
- “instanceof 와 클래스 인터페이스 가 혼동될 때 참고할 및 동작 원리”

이해가 되셨길 바라며, 추가적으로 궁금한 점이 있으시면 언제든지 질문해 주세요. 곧 지식공유자께서도 답변해 주실 것입니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

인프런 커뮤니티 질문&답변

instanceof 관련 질문