type과 interface

김진효·2026년 7월 2일

interface type typescript

[CS] 면접 대비

목록 보기

8/8

타입스크립트에서는 type과 interface 라는 두 가지 키워드로 객체의 타입을 정의할 수 있다

결론부터 말하자면, 보통 객체의 타입의 경우 interface를 기본으로 사용하고, type은 더 다양한 타입 표현을 위해 사용!

선언 병합을 활용하는 경우라면 interface 을 사용하고 특별한 기준이 없으면 개인 선호와 팀 컨벤션에 따라 어떤걸 사용해도 무방

interface

객체 및 클래스 타입 정의 가능

interface User {
  name: string
  age: number
}

type

객체 타입 뿐만 아니라 모든 유형의 타입 정의 가능
간단한 타입 정의 또는 함수 타입 표현에 좋음
유니온, 튜플, 교차, 원시 타입 등의 복잡한 타입 조합을 정의할 수 있음

// 원시 타입
type Name = string
type Age = number

// 유니온
type ID = string | number
type Option = A | B | C 

// 튜플
type Point = [number, number]

// 객체
type User = { name: string }

`type` vs `interface` 특징 비교표

특징 / 기능	`type` (타입 별칭)	`interface` (인터페이스)
주요 목적	유니온, 튜플 등 모든 타입 정의	객체 및 클래스 타입 정의
확장 방법	`&` 연산자로 확장	`extends` 키워드 사용 (캐싱 이점 있음!)
중복 선언 시 동작	오류 발생	선언 병합 (같은 이름 선언 시 자동으로 합쳐짐)
클래스 구현	`implements` 비권장	`implements` 키워드로 클래스 구현 가능
computed value	가능 ([key in T])	불가능

선언적 병합

type은 같은 이름으로 확장하면 오류
→ Error: Duplicate identifier

interface는 같은 이름으로의 확장 가능
나중에 선언된 걸로 바뀌는 것도 아니고, 같은 이름의 서로 다른 인터페이스들의 속성을 모두 병합!

computed value (맵드 타입)

유니온 타입이나 기존 타입의 키를 순회하여 객체의 프로퍼티를 동적으로 생성하는 타입 문법

type UserRole = 'admin' | 'manager' | 'user';

// Mapped Type
type RolePermissions = {
  [key in UserRole]: boolean; 
};

type RolePermissions = {
  admin: boolean;
  manager: boolean;
  user: boolean;
};

주로 사용하는 이유

기존 타입의 속성에 readonly나 ?를 붙여 읽기 전용 또는 선택적 속성으로 변환
객체의 값 타입을 바꾸기

type UserFields = 'name' | 'email' | 'avatar'
	
	  // 로딩 상태 관리
type LoadingState = {
  [key in UserFields]: boolean
}

유니온 타입과 조합

type PaymentMethod = 'toss' | 'kakaoPay' | 'naverPay' | 'creditCard';

type PaymentStatus = {
  [Method in PaymentMethod]: boolean;
};

const systemStatus: PaymentStatus = {
  toss: true,
  kakaoPay: false,
  naverPay: true,
  creditCard: true