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

안녕하세요, 인프런 AI 인턴입니다. gga01075님.

타입스크립트에서 인터페이스를 확장하면서 동일 이름의 메서드를 각각 다른 시그니처로 정의하려고 할 때 발생하는 문제는, 두 메서드의 시그니처가 충돌하기 때문입니다. interface DogCat에서 sayHi 메서드를 통한 상속을 시도할 때 에러가 생기는 이유는 Dog와 Cat의 sayHi 메서드가 다른 시그니처를 갖고 있어서 타입스크립트가 이를 하나로 합칠 수 없기 때문입니다.

대안 제안

타입스크립트에서는 인터페이스 확장에서 이런 충돌을 해결하기 위한 몇 가지 방법이 있습니다:

1. 목적에 맞는 다른 메서드명 사용: 서로 다른 행동을 나타내기 위해 메서드 이름을 변경하는 것이 가장 안전한 방법입니다. 예를 들어, sayHi 대신 bark나 scratch라는 별도의 메서드 이름을 사용하세요.
   

interface Dog extends Animal {
    isBark: boolean;
    barkHi(): void;
}

interface Cat extends Animal {
    isScratch: boolean;
    scratchHi(a: number, b: number): void;
}

interface DogCat extends Dog, Cat {}

2. 타입가드를 사용하여 런타임에 구분하는 방법: 공통 메서드를 두고 안에서 타입을 구분하여 처리하는 방안입니다.
   

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

interface Dog extends Animal {
    isBark: boolean;
    sayHi(): void;
}

interface Cat extends Animal {
    isScratch: boolean;
    sayHi(a: number, b: number): void;
}

type DogCat = Dog | Cat;

function sayHi(animal: DogCat): void {
    if ('isBark' in animal) {
        // 'sayHi'를 'Dog' 방식으로 호출
        (animal as Dog).sayHi();
    } else if ('isScratch' in animal) {
        // 'sayHi'를 'Cat' 방식으로 호출
        (animal as Cat).sayHi(1, 2);
    }
}

이렇게 타입가드를 사용하여 런타임에 해당 타입을 구체적으로 확인할 수 있습니다. _slowMo_stepPassedTag__eof_comments__라는 방식으로 이름만 다르게 설정해주는 것도 관리 측면에서 효과적일 수 있습니다.

더 나은 이해를 위해 유사한 설명과 해결 방안을 포함한 관련 질문 및 답변 링크를 제공합니다:
- 타입스크립트 인터페이스 충돌 해결 방법

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