type vs interface

STUDY-MOLE

위기의 두더지, 더 공부하자는 의미를 담은 어제 결성된 스터디(두 명)다
평일 첫째 주, 유냇시의 PR을 리뷰하며 빠르게 정리해보자

type vs interface

type과 interface는 객체를 타이핑하기 위해 사용하는 키워드이다

사용 예시

type Object = { // 변수를 선언하는 것과 비슷
    title: string;
    description: string;
};

interface IObject { // interface라는 이름처럼 객체 타입을 선언
    title: string;
    description: string;
};

const object1: Object = {...};
const object2: IObject = {...};

내가 원래 알고 있던 유일한 차이점은 = 붙이냐 마냐 인데
조금 더 자세히 보자면 type은 = 키워드를 사용하여 타입 정보를 할당하는 개념이고,
interface는 타입 자체를 선언하는 느낌이다.

차이점

1. 정의 가능한 타입의 종류

• type : 원시 타입, 객체 타입, 튜플 타입, 함수 타입, 유니온 타입, 매핑된 타입
• interface : 객체 타입

type A = string; // primitive
type B = {name: 'studymole', member: 2}; // object
type C = [string, number, boolean]; // *tuple
type D = 'apple' | 'potato'; // *union
type E = { [K in keyof T] : string }; // **mapped

* ❓
** ❓

2. 타입 확장 방법

• type : & 키워드
• interface : extends 연산자

type B = A & {
    ...
}

interface B extends A

• interface : 선언적 확장 가능
• type : ❌

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

// 선언적 확장
interface A {   
    email: string;  
}

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

// ❗️Error: Duplicate indentifier 'B'
type B = {
    email: string;  
}

결론

type은 모든 타입을 정의할 수 있고 확장도 가능하기에 인터페이스를 대부분 커버할 수 있다. 그러나 확장면에서는 interface가 더 유연하다. type과 interface중 어떤 키워드를 사용할지는 개인의 취향이나 팀의 컨벤션에 따라 다를 수 있다.

summary

type과 interface는 객체를 타이핑하기 위해 사용하는 키워드입니다. interface는 객체 타입만을 정의할 수 있는 반면, type은 모든 유형의 타입을 정의할 수 있습니다. 확장 시 type은 & 키워드를, interface는 extends 연산자를 사용하며 interface는 선언적 확장이 가능하다는 특징을 갖습니다.