[TypeScript] 타입스크립트 인터페이스 확장

1. 인터페이스 확장

인터페이스는 extends 키워드로 확장할 수 있습니다.

자바나 자바스크립트의 상속과 비슷하다고 할 수 있겠네요.

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

interface HongGilDong extends Person {
  gender: string;
}

const p: HongGilDong = {
  name: "홍길동",
  age: 30,
  gender: "남",
};

console.log(p.name); // 홍길동
console.log(p.age); // 30
console.log(p.gender); // 남

 

1-1. 프로퍼티 재정의

재정의하는 것도 가능합니다.

중요한 것은 재정의하는 타입은 원래 타입의 서브타입이 되어야 합니다.

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

interface HongGilDong extends Person {
  name: "홍길동"; // 홍길동으로 정의
  // name: number; // 에러
  age: number;
  gender: string;
}

const p: HongGilDong = {
  name: "홍길동",
  age: 30,
  gender: "남",
};

console.log(p.name); // 홍길동
console.log(p.age); // 30
console.log(p.gender); // 남

 

1-2. 타입 확장

타입을 확장할 수도 있습니다.

type Animal = {
  name: string;
}

interface Rabbit extends Animal {
  food: string;
}

 

1-3. 다중 확장

여러 개를 확장할 수도 있습니다.

interface Cow {}
interface Pig {}

interface CowPig extends Cow, Pig {}

 

2. 병합

인터페이스는 동일 스코프에서 여러 개를 만들 수 있습니다.

interface Jacket {
  name: string;
}
interface Jacket {
  price: number;
}