타입 별칭 결합하기
Coddy JavaScript 여정의 TypeScript 소개 섹션에 포함된 레슨. 73개 중 35번째.
타입 별칭의 가장 강력한 측면 중 하나는 정교한 타입 정의를 만들기 위해 결합되고 재사용될 수 있다는 점입니다. 매번 복잡한 타입을 처음부터 정의하는 대신, 더 작고 집중된 타입 별칭들을 함께 조합하여 구축할 수 있습니다.
이 접근 방식은 코드 재사용성을 높이고 타입 정의를 더 유지보수하기 쉽게 만듭니다. 기본 타입을 업데이트해야 할 때, 이를 사용하는 모든 구성된 타입들이 자동으로 변경 사항을 상속받습니다:
type Email = string;
type Phone = number;
type Contact = {
name: string;
email: Email;
phone: Phone;
};유니언 타입 내에서 타입 별칭을 결합하여 유연한 데이터 구조를 만들 수도 있습니다. 이는 객체 속성이 서로 다른 형식을 허용할 수 있는 경우에 특히 유용합니다:
type ContactMethod = Email | Phone;
type User = {
id: number;
preferredContact: ContactMethod;
};이러한 조합적 접근 방식은 코드를 더 표현력 있게 만들고 이해하기 쉽게 해줍니다. string이나 number와 같은 일반적인 타입을 보는 대신, 다른 개발자들은 Email 및 Phone과 같은 의미 있는 타입 이름을 통해 의도된 목적을 즉시 이해할 수 있습니다.
챌린지
쉬움string 타입에 대한 Username이라는 이름의 타입 별칭을 생성하세요.
number 타입에 대한 UserAge라는 이름의 타입 별칭을 생성하세요.
유니온 타입을 사용하여 Username과 UserAge를 결합한 ContactMethod라는 이름의 타입 별칭을 생성하세요.
다음 속성을 가진 객체에 대한 UserProfile이라는 이름의 타입 별칭을 생성하세요:
number타입의idUsername타입의displayNameContactMethod타입의preferredContact
교차 타입을 사용하여 UserProfile과 string 타입의 permissions 속성을 포함하는 추가 객체 타입을 결합한 AdminProfile이라는 이름의 타입 별칭을 생성하세요.
이제 다음 변수들을 생성하세요:
- id는
1, displayName은"john_doe", preferredContact는"john_doe"인UserProfile타입의regularUser변수를 생성하세요. - id는
2, displayName은"admin", preferredContact는25, permissions는"full_access"인AdminProfile타입의systemAdmin변수를 생성하세요.
ContactMethod 타입의 contact라는 매개변수를 받아 string을 반환하는 getContactInfo라는 이름의 함수를 생성하세요. 타입 가드를 사용하여 타입을 확인하고 다음을 반환하세요:
- 문자열인 경우:
"Contact: [contact]" - 숫자인 경우:
"Age: [contact]"
다음 출력값들을 각각 별도의 줄에 출력하세요:
regularUser.preferredContact를 사용하여getContactInfo를 호출하고 그 결과를 출력하세요.systemAdmin.preferredContact를 사용하여getContactInfo를 호출하고 그 결과를 출력하세요.systemAdmin.permissions를 출력하세요.
직접 해보기
// TODO: 여기에 코드를 작성하세요
// Username, UserAge, ContactMethod, UserProfile, AdminProfile에 대한 타입 별칭을 생성합니다
// regularUser와 systemAdmin 변수를 생성합니다
// getContactInfo 함수를 생성합니다
// 필요한 출력을 인쇄합니다이 레슨에는 짧은 퀴즈가 포함되어 있습니다. 레슨을 시작해 문제를 풀고 진행 상황을 기록하세요.
TypeScript 소개의 모든 레슨
직접 연습해 보세요: 온라인 JavaScript 컴파일러