[TS] interface와 type

서론

최근에 둘의 차이가 뭐냐는 질문에 아는 정도로만 답했는데
더 있나 싶어서 찾아봤다

참고

• typescript 공식 문서

타입 정의

type

• string, number, boolean 원시타입 표현이 다 가능
• tuple, array, object 타입 표현 가능

type String = string
type Number = number
type Boolean = boolean
type ArrayList = Array<T>

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

interface

• 원시 타입 불가
• 객체 타입만 표현 가능

//interface Obj = number;
// 'number' only refers to a type, but is being used as a value here.

interface Obj {
  name: string;
  age: number;
  phone: string;
  isStudent: boolean;
}

함수 타입

type

type GreetingType = (name: string) => string;

interface

• 나는... 이해가 안 가는 형태라 사용하지 않을 것 같은데
• 이 형태를 그냥 문법 처럼 받아들이고 있다...

interface GreetingInterface {
    (name: string): string
}

확장

• 중복된 형태의 타입은 확장해서 사용하거나 병합이 가능하다

type

• & 연산자를 통해 타입 확장 및 병합을 할 수 있다

type Obj1 = {
    name: string
}


type Obj2 = {
    age: number
}

type Obj = Obj1 & Obj2

const obj: Obj = {
    name: 'josoohyun',
    age: 9
}

interface

• interface는 union 타입을 사용할 수 없다
• extends라는 키워드로 확장이 가능

interface Obj1 {
    name: string
}

interface Obj2 {
    age: number;
}

interface Obj extends Obj1, Obj2 {

}

const obj:Obj = {
    name:'soo',
    age: 10,
}

• extends 확장 시, 중복된 프로퍼티 명이 있으면 에러가 남
  

• 클래스를 extends할 수 있다
• 클래스의 속성과 메서드를 인터페이스에서 재사용 가능해 진다
• 속성 값 name은 자동으로 타입 추론이 들어간다.

class Dog {
    name = 'ponge' // 속성
}

interface Animal extends Dog {
    age: number
}


const animal:Animal = {
    name:'hoya',
  // name: 9, // 자동 타입 추론으로 숫자 타입 넣으면 에러남
    age: 8
}

• extends 키워드 없이도 interface는 같은 이름으로 여러 번 선언이 가능하다
• 자동으로 병합해 주는데 이를 선언 병함이라고 한다
• type은 에러가 뜬다

interface Obj {
    name: string
}

interface Obj {
    age: number;
}

const obj:Obj = {
    name:'soo',
    age: 10,
}

type alias vs interface

• 내가 궁금했던 건 성능이라던지, 동작 방식에 대해 큰 차이가 있는 줄 알았다
• 공식 문서에서는 컴파일러 성능 측면에서 객체 병합 시 extends가 좋아서 interface를 더 권장한다고 한다
• 밑에 휴리스틱 어쩌구도 읽어보시길...되도록 interface 권장!

	type alias	interface
원시 타입	⭕️	❌
객체 타입	⭕️	⭕️
타입 병합	`&`연산자로 가능	extends 키워드 사용 또는 선언 병합 가능
중복 선언	에러	선언 병합

마무리

최근에 취업한 친구랑 얘기하다가 자기 회사 사람들 바보라고 type이랑 interface 차이도 말로 못 한다고 해서 내가 아는 게 다가 아닐까봐 걱정했다. 다행히 크게 모르진 않았던 것 같다 ㅎ
아는 개념이라도 정리하고 나니 말로 하기도 편해졌다 이제 계획대로라면 곧 이력서 넣고 면접 보러 다녀야하는 시즌이라 이런 개념들 복습 잘 해놔야겠다