JavaScript & TypeScript

[TS] type alias, interface 차이

반응형

type alias, interface는 쉽게 말해서 어떤 오브젝트에 대한 정의를 할 때 주로 선언을 하게 됩니다.

 

type alias, interface 으로 선언을 하면 공통적으로

  • object에 정의를 하고 타입을 할당이 가능하고
  • class에서도 implements를 통해 구현이 가능하고
  • extends 상속을 통해서 확장도 가능합니다.

 

차이점으로는

interface는 오브젝트와 오브젝트간의 약속사항으로 상호작용을 도와줍니다.

그렇기 때문에 동일한 규격으로 어떤 것을 구현할 때 interface를 사용하는게 좋습니다. 

 interface Person {
    makeEmail(age: number): Email;
  }
  
 interface Person {
    makePhone(age: number): Phone;
  }

(interface는 같은 이름으로 두 번 선언을 하게 되면, 오류가 생기지 않고 합한(병합)한 내용으로 사용을 해야 합니다. 반면에 타입은 두 번 선언하는것이 불가능 합니다.)

 

 

 

type은 선언을 하게 되면, 어떠한 데이터를 담을 때 타입을 결정하는 것으로, 유연하게 나눠서 사용이 가능합니다.

  type Person = {
    name: string;
    age: number;
  };
  
  type Name = Person['name']; // string type

 

 

참고 내용에서는 합 타입 혹은 튜플 타입을 반드시 써야 되는 상황은 type을 권장하지만

interface를 주로 사용하고 있으며 성능과 병합이 가능하다는 이유로 권장 하고 있는 것 같습니다.

하지만 분명 차이점은 존재하기 때문에 상황에 따라 명확하게 사용하는 것이 더 중요하다고 생각합니다. 

 

참고 내용

https://medium.com/humanscape-tech/type-vs-interface-%EC%96%B8%EC%A0%9C-%EC%96%B4%EB%96%BB%EA%B2%8C-f36499b0de50

https://yceffort.kr/2021/03/typescript-interface-vs-type

반응형

'JavaScript & TypeScript' 카테고리의 다른 글

[TS] Compile (option)  (0) 2022.03.22
[TS] utility type  (0) 2022.03.21
[JS] ProtoType  (0) 2022.03.15
[TS] 제네릭(Generics)  (0) 2022.03.14
[TS] OOP  (0) 2022.03.14