개발자가 내팔자

[TypeScript] Type과 Interface 본문

Programming Language/JavaScript

[TypeScript] Type과 Interface

야생의 개발자 2022. 7. 6. 14:45

Type

범용적으로 타입을 정의할 때 쓰인다.
다양한 방식으로 쓸 수 있다.

type Name = string;
type Color = "red" | "green" | "blue";

Interface

주로 객체를 정의할 때 쓰인다. 약간 클래스와 비슷하다.
그래서 다른 인터페이스를 상속받을 수 있다.

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

interface Writer extends Person {}

const me : Writer = {
  name: "gaeyomi",
  age: 3
}

인터페이스는 이런 이상한 짓도 된다.

interface User {
  name: string
}

interface User {
  age: number
}

interface User {
  dream: string
}

const me: User = {
  name: "gaeyomi",
  age: 3,
  dream: "developer"
}

서로 다른 내부 프로퍼티를 갖는 동일한 이름의 인터페이스를 만들면 알아서 합쳐준다.
type은 안된다. 여러 번 선언하면 합쳐지는 것이 아니라 에러가 난다.

Type과 Interface

Interface로 표현할 수 있는 것을 Type 형식으로 표현할 수도 있다.
그러나 interface로 표현하면 좀 더 우리에게 친숙한 객체 지향적인 표현이 가능하다.


/* Interface */
interface User {
  name: string;
}

interface Player extends User {}

const me: Player = {
  name: "gaeyomi"
}

/* Type */
type User = {
  name: string
}

type Player = User & {}

const me: Player = {
  name: "gaeyomi"
}

성능의 차이?

type의 경우 재귀적으로 순회하며 속성을 merge하는데, 이 경우에 일부 never가 나오면서 제대로 머지가 안될 수 있다고 한다. interface는 단순 객체 타입을 만들기 위한 것인데, type은 원시 타입이 올 수도 있기 때문에 충돌이 나서 제대로 merge가 안되는 경우에는 never가 나올 수 있기 때문이다. 따라서 type간 속성을 merge를 할 때는 주의를 필요로 한다. 객체에서만 쓴다면 interface를 쓰는 것이 좋다.


interface를 합성할 경우에는 캐싱이 되지만 type의 경우는 그렇지 않다. 따라서 type을 합성할 경우에는 컴파일 시에 상대적으로 성능이 좋지 않다고 한다. 상황에 따라 typeinterface를 적절히 쓰는 것이 좋지만 객체를 쓸 때나 type 합성의 경우를 고려하여 interface를 쓰는 것이 좋다. 공식문서에서도 특별한 경우를 제외하고는 type보다는 interface가 권장되고 있다.

'Programming Language > JavaScript' 카테고리의 다른 글

[TypeScript] Abstract Class와 Interface  (0) 2022.07.06
NodeJS의 특징, 강점, 약점  (0) 2022.06.13
Comments