Typescript 인터페이스 타입 차이점?

 

인터페이스(Interface) vs Type 차이점

 

타입스크립트 에서 인터페이스는 변수의 타입 강제와 하위 클래스에서 메소드 구현을 강제하는 2가지 용도로 사용됩니다. 타입 강제 부분에서 유사한 기능을 하는 Type이 있지만 인터페이스와 타입은 차이점이 존재합니다.

 

 

① 우선 인터페이스는 동일한 이름을 가지고 확장이 가능합니다. 코드를 보시면 Obj라는 동일한 이름의 인터페이스를 선언했지만 기능이 확장됩니다.

interface Obj {
    name:string
    age:number
}

interface Obj{
    address:string
}

const o:Obj = {
    name:'about-tech',
    age:100,
    address:'Korea'
}

console.log(o);

 

② 인터페이스는 객체에만 적용이 가능합니다. 아래처럼 선언은 불가능합니다.

interface Obj:string;

 

③ 인터페이스 확장은 extends 키워드를 사용합니다. type은 & 연산자를 사용해서 확장 가능합니다.

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

interface Obj2 extends Obj1 {
  address: string;
}

type Obj3 = {
  name: string;
  age: number;
};

type Obj4 = Obj3 & {
  address: string;
};

 

④ Interface는 Computed Value를 사용할 수 없습니다.

type school = "University" | "Highschool";

type Students = {
  // OK
  [item in school]: number;
};

interface IStudents {
  // Compile Error
  [item in school]: number;
}

 

⑤ 인터페이스 합성의 경우 Cache가 지원되지만 Type은 그렇지 않습니다. 즉, 타입을 강제하는 경우 Interface 사용이 권장되고 있습니다.

 

 

🚀️ 도움이 되셨다면 구독과 좋아요 부탁드립니다 👍️

 

 

객체 지향 프로그래밍이란(OPP)

 

Transpile VS Compile 차이점?

 

Nginx 란? 웹 서버 개념 이해하기