고급 TypeScript - 고급 타입: 인터섹션 타입
고급 타입: 인터섹션 타입
인터섹션 타입은 여러 개의 타입을 결합하여 새로운 타입을 생성하는 강력한 기능입니다. TypeScript에서 인터섹션 타입을 사용하면 서로 다른 객체의 속성을 조합할 수 있으며, 이를 통해 복잡한 데이터 구조를 효율적으로 표현할 수 있습니다.
1. 기본 개념
인터섹션 타입은 &
연산자를 사용하여 정의됩니다. 두 개 이상의 타입이 결합되면, 결과는 모든 구성 요소의 속성을 포함하는 새로운 객체가 됩니다. 이 방식으로 다양한 형태의 데이터를 하나로 통합할 수 있습니다.
예를 들어:
type Person = {
name: string;
age: number;
};
type Employee = {
employeeId: number;
};
// 인터섹션 타입 정의
type EmployeePerson = Person & Employee;
const john: EmployeePerson = {
name: "John Doe",
age: 30,
employeeId: 12345,
};
위 예제에서 EmployeePerson
은 Person
과 Employee
두 가지 유형을 결합한 것입니다. 따라서 john
객체는 두 가지 유형 모두의 속성을 가집니다.
2. 활용 사례
인터섹션 타입은 다음과 같은 상황에서 유용하게 사용할 수 있습니다:
- 다양한 역할:
여러 역할이나 특성을 가진 객체를 표현할 때 유용합니다.
type Developer = {
programmingLanguages: string[];
};
type Manager = {
teamSize: number;
};
// 개발자이자 관리자인 경우
type TechLead = Developer & Manager;
const alice: TechLead = {
programmingLanguages: ["JavaScript", "TypeScript"],
teamSize: 5,
};
- 복잡한 API 응답 처리:
API 응답이 여러 다른 형식을 포함해야 할 때 유용합니다.
interface ApiResponseSuccess {
statusCode: number;
data: any; // 실제 데이터 형식에 따라 변경 가능
}
interface ApiResponseError {
statusCode: number;
errorMessage: string;
}
// 성공 및 오류 응답을 모두 처리하기 위한 인터셉터타입 정의
type ApiResponse = ApiResponseSuccess | ApiResponseError;
function handleApiResponse(response: ApiResponse) {
if ('errorMessage' in response) {
console.log(`Error ${response.statusCode}: ${response.errorMessage}`);
} else {
console.log(`Success ${response.statusCode}:`, response.data);
}
}
3. 장점과 단점
장점:
- 코드 재사용성이 높아지고, 중복된 코드를 줄일 수 있습니다.
- 명확하고 직관적인 데이터 모델링이 가능합니다.
단점:
- 너무 많은 인터페이스나 유형을 결합하면 복잡도가 증가할 수 있으므로 주의가 필요합니다.
결론적으로, 인터섹션 타입은 TypeScript에서 매우 중요한 도구이며, 적절히 활용하면 코드 품질과 유지보수성을 크게 향상시킬 수 있습니다.