본문 바로가기
Node js/Typescript(Javascript)

type vs interface ( type 과 interface 차이 )

by Bill Lab 2024. 11. 26.
728x90

객체의 상속

 

[interface]

extends 키워드를 이용해서 상속받을 수 있다.

(interface 는 상속을 통해 확장)

interface 시험 {
  점수: number;
  등급: number;
}

interface 과목 extends 시험 { //시험 으로 부터 상속받아 과목에 추가
  과목명: string;
}

const 중간고사: 과목 = {
  점수: 99,
  등급: 1,
  과목명: '코딩'
}

 

[type]

& 기호를 이용해서 확장성 있게 사용할 수 있다.

(type 은 교차 타입을 통해 확장)

type 시험 = {
  점수: number,
  등급: number
}

type 과목 = 시험 & { 
  과목명: string
}

const 중간고사: 과목 = {
  점수: 99,
  등급: 1,
  과목명: '코딩'
}

 

 

선언 병합(Declaration Merging)

interface 만 가능 type 은 지원하지 않음

(interface 가 여러번 쓰이면 자동으로 병합 됨)

interface 시험 {
  점수: number;
  등급: number;
}

// 선언적 확장 구문
interface 시험 { 
  시험시간: Date;
}

const 중간고사: 시험 = {
  점수: 99,
  등급: 1,
  시험시간: 2024년11월26일 오후...
}

 

 

자료형

[interface]

"객체 타입"에는 사용가능하지만, 원시타입(string, number 등) 에는 사용할 수 없다.

 

[type]

객체 타입, 원시타입 모두 사용 가능하다

 

 

 

computed value

[interface]

computed value 지원하지 않음

 

[type]

computed value 지원

type 과목 = '수학' | '영어 | '국어';

type Grades = {
  [key in 과목]: string;
}

 

결론 

type 은 선언적인 의미로, 외부와의 추상체를 두지 않고 소스 내 직접 선언하여 사용될때에는 type 을 사용하는게 좋고

이를 추상체로 외부와의 연동이나, 연동된 data를 받아올때의 유입지점에서의 data mapping 에서는 객체타입의 추상체만을

목적으로 interface 를 사용하는 것이 좋다.

 

직접선언해서 사용시 필요한 내역들은 type 에서 모두 제공을 하고 있고(원시타입, 참조타입(객체 포함)) 모두, interface 의 경우,

객체 타입만 사용이 가능하다. 단일 항목에 대해 외부와의 콜을 통해 받아와야하는 data 가 string 하나라 하더라도 interface 를 통해

개발을 하자(이후 parameter 값이 증가될 부분도 고려) 

 

 

728x90

'Node js > Typescript(Javascript)' 카테고리의 다른 글

Typescript 성능개선 발표! (x 10)  (0) 2025.03.13