Type, 또는 Interface, 그것이 문제로다 (TypeScript에서)
Min-jun Kim
Dev Intern · Leapcell

TypeScript에서 type
과 interface
는 모두 타입을 정의하는 데 사용되며, 많은 경우에 서로 대체 가능합니다. 그러나 몇 가지 중요한 차이점과 특정 사용 사례가 있습니다. type
과 interface
의 차이점을 자세히 살펴보기 전에 기본적인 사용법을 먼저 살펴보겠습니다.
1. 기본 사용법: type
과 interface
로 객체 타입 정의하기
// interface 사용 interface User { name: string; age: number; } // type 사용 type UserType = { name: string; age: number; }; const user1: User = { name: 'Alice', age: 25 }; const user2: UserType = { name: 'Bob', age: 30 };
이 예제에서 interface
와 type
모두 객체 타입을 정의할 수 있으며, 사용법에 거의 차이가 없습니다.
2. 확장 (Extend)
2.1 interface
확장
interface
는 상속을 사용하여 확장할 수 있습니다.
interface User { name: string; age: number; } interface Admin extends User { role: string; } const admin: Admin = { name: 'Alice', age: 30, role: 'Administrator', };
2.2 type
확장
type
은 교차 타입(intersection types)을 사용하여 확장할 수 있습니다.
type UserType = { name: string; age: number; }; type AdminType = UserType & { role: string; }; const adminType: AdminType = { name: 'Bob', age: 35, role: 'Admin', };
차이점:
interface
는extends
키워드를 사용하여 상속합니다.type
은&
(교차 타입)을 사용하여 확장합니다.
3. 선언 병합 (Declaration Merging)
3.1 interface
의 선언 병합
interface
는 동일한 이름으로 여러 번 선언할 수 있습니다. TypeScript는 자동으로 멤버들을 병합합니다.
interface User { name: string; } interface User { age: number; } const user: User = { name: 'Alice', age: 25 }; // 병합된 User 인터페이스는 name과 age 속성을 모두 포함합니다.
3.2 type
은 선언 병합을 지원하지 않음
type
은 중복 선언을 허용하지 않으며, 중복 선언 시 오류가 발생합니다.
type UserType = { name: string; }; // 동일한 타입을 다시 선언하면 오류가 발생합니다. type UserType = { age: number; // Error: Duplicate identifier 'UserType'. };
차이점:
interface
는 선언 병합을 지원하여 여러 선언을 결합할 수 있습니다.type
은 선언 병합을 지원하지 않습니다.
4. 유니온 타입과 교차 타입
4.1 type
은 유니온 및 교차 타입을 지원
type
은 유니온 타입과 교차 타입 정의를 지원하며, interface
는 지원하지 않습니다.
// 유니온 타입 type Status = 'success' | 'error' | 'loading'; // 교차 타입 type Name = { name: string }; type Age = { age: number }; type Person = Name & Age; const person: Person = { name: 'Alice', age: 25 };
4.2 interface
는 유니온 타입을 지원하지 않음
interface
는 유니온 타입을 직접 정의할 수 없습니다.
// 지원되지 않음 interface Status = "success" | "error" | "loading"; // Error
차이점:
type
은 유니온 및 교차 타입을 지원하여 여러 타입을 결합할 때 더 유연합니다.interface
는 유니온 타입을 정의할 수 없지만, 객체 타입을 확장할 수 있습니다.
5. 타입 별칭 (Type Aliases)
type
은 기본 자료형, 튜플, 유니온 타입 등 다양한 타입에 대한 별칭을 정의할 수 있습니다.
// 기본 타입 별칭 정의 type ID = number | string; // 튜플 타입 정의 type Point = [number, number]; const id: ID = 123; const point: Point = [10, 20];
반면에 interface
는 객체 타입만 정의할 수 있습니다.
6. 구현 (Implements) 및 확장 (Extends)
6.1 클래스 구현을 위한 interface
interface
는 클래스의 구조를 제한할 수 있습니다.
interface User { name: string; age: number; } class Person implements User { name: string; age: number; constructor(name: string, age: number) { this.name = name; this.age = age; } }
6.2 type
도 클래스를 제한할 수 있음
interface
가 일반적으로 이 용도로 사용되지만, type
도 유사한 기능을 수행할 수 있습니다.
type UserType = { name: string; age: number; }; class PersonType implements UserType { name: string; age: number; constructor(name: string, age: number) { this.name = name; this.age = age; } }
차이점:
interface
는 선언 병합 및 타입 확장이 더 자연스럽기 때문에 클래스 설계에 더 일반적으로 사용됩니다.type
은 클래스를 제한할 수도 있지만 유니온 및 복잡한 타입 구성 정의에 더 적합합니다.
7. 상호 운용성
7.1 interface
와 type
은 혼합 가능
interface
와 type
은 실제로 혼합하여 사용할 수 있습니다. 예를 들어 interface
는 type
을 확장할 수 있고, 그 반대도 가능합니다.
type Name = { name: string }; interface User extends Name { age: number; } const user: User = { name: 'Alice', age: 25 };
7.2 type
은 interface
를 확장할 수 있음
interface User { name: string; age: number; } type Admin = User & { role: string; }; const admin: Admin = { name: 'Bob', age: 35, role: 'Admin' };
차이점:
interface
는type
을 확장할 수 있고,type
은interface
를 확장할 수 있어 유연하게 결합할 수 있습니다.
8. 복잡한 타입 표현
8.1 type
은 더 큰 표현력을 제공
type
은 유니온 타입, 교차 타입, 타입 별칭을 지원하므로 복잡한 타입 구성을 정의하는 데 더 유연합니다.
type ComplexType = string | number | { name: string }; const value1: ComplexType = 'Hello'; // 유효함 const value2: ComplexType = 123; // 유효함 const value3: ComplexType = { name: 'Alice' }; // 유효함
8.2 interface
는 객체 구조에 더 적합
interface
는 객체 구조를 설명하는 데 중점을 두며 유니온 타입이나 복잡한 타입 조합에는 덜 적합합니다.
9. 사용 사례 요약
interface
를 사용해야 하는 경우:
- 객체 타입 정의, 특히 객체 지향 설계.
implements
로 클래스 제한.- 선언 병합이 필요한 시나리오 (예: 타사 라이브러리 타입 정의).
type
을 사용해야 하는 경우:
- 유니온 타입, 교차 타입 및 기타 복잡한 구성 정의.
- 기본 타입 및 튜플에 대한 별칭 생성.
- 타입 결합에 더 많은 유연성이 필요한 시나리오.
결론
interface
- 객체 타입 정의: ✅
- 기본 타입 별칭: ❌
- 선언 병합: ✅
- 확장:
extends
상속 - 유니온 타입: ❌
- 교차 타입: ❌
- 클래스 구현: ✅
- 표현력: 객체 구조 정의에 적합
- 일반적인 사용 사례: 객체 지향 설계, 인터페이스를 이용한 클래스 결합
type
- 객체 타입 정의: ✅
- 기본 타입 별칭: ✅
- 선언 병합: ❌
- 확장:
&
교차 타입 - 유니온 타입: ✅
- 교차 타입: ✅
- 클래스 구현: ✅ (덜 일반적임)
- 표현력: 복잡한 타입 구성에 적합
- 일반적인 사용 사례: 유니온 타입, 복잡한 타입 정의, 타입 별칭 등
전반적으로 interface
는 객체 지향 프로그래밍, 특히 클래스 설계 및 상속에 더 적합합니다. 반면에 type
은 더 유연하며 더 복잡한 타입 구성 및 타입 별칭과 관련된 시나리오에 이상적입니다. 대부분의 프로젝트에서 interface
와 type
은 상호 보완적으로 사용할 수 있습니다.
Node.js 프로젝트 호스팅을 위한 최고의 선택, Leapcell입니다.
Leapcell은 웹 호스팅, 비동기 작업, Redis를 위한 차세대 서버리스 플랫폼입니다:
다국어 지원
- Node.js, Python, Go 또는 Rust로 개발하십시오.
무제한 프로젝트를 무료로 배포
- 사용량에 대해서만 지불하십시오. 요청이나 요금이 없습니다.
탁월한 비용 효율성
- 유휴 요금 없이 사용량에 따라 지불합니다.
- 예: $25로 평균 응답 시간 60ms에서 694만 건의 요청을 지원합니다.
간소화된 개발자 경험
- 간편한 설정을 위한 직관적인 UI.
- 완전 자동화된 CI/CD 파이프라인 및 GitOps 통합.
- 실행 가능한 통찰력을 위한 실시간 메트릭 및 로깅.
간편한 확장성 및 고성능
- 고도의 동시성을 쉽게 처리하기 위한 자동 스케일링.
- 운영 오버헤드가 전혀 없습니다. 구축에만 집중하세요.
Documentation에서 자세히 알아보세요!
X에서 팔로우하세요: @LeapcellHQ