TypeScript - Type Aliases: A Beginner's Guide

안녕하세요, 미래의 코딩 슈퍼스타! ? TypeScript의 세계로 흥미로운 여정을 떠나 준비되셨나요? 오늘 우리는 Type Aliases라는 멋진 기능을 탐구해볼 거예요. 프로그래밍 초보자라고 걱정하지 마세요 - 저는 친절한 가이드로서 단계별로 안내해드릴게요. 당신의 좋아하는 음료를 한 잔 가져오고 편안하게 앉아서 시작해보세요!

Type Aliases는 무엇인가요?

자, 구체적인 내용에 들어가기 전에 Type Aliases가 무엇인지 이해해보겠습니다. 당신의 애정이 가득한 옷이 있을 거예요. ("나의 파란 청바지에 하얀 티셔츠와 빨간 신발")을 매번 자세히 설명하는 대신, "나의 캐주얼 룩"이라는 별명을 주는 것을 상상해보세요. TypeScript에서 Type Aliases는 이와 비슷하게 작동합니다 - 우리는 타입에 이름을 지어서 나중에 더 쉽게 사용할 수 있게 합니다.

문법: Type Alias 생성 방법

Type Alias를 생성하는 것은 매우 간단합니다. 다음은 기본 문법입니다:

type 별명 = 기존타입;

이를 하나씩 풀어보겠습니다:

• type: 이 키워드는 TypeScript에게 우리가 Type Alias를 생성하고 있음을 알립니다.
• 별명: 당신이 선택한 별명입니다. 설명적이게 만들어주세요!
• 기존타입: 당신이 별명을 만드는 타입입니다.

기본 타입 별칭

먼저 간단한 것으로 시작해보겠습니다. TypeScript에는 string, number, boolean과 같은 기본 타입이 있습니다. 이들에 대한 별칭을 만들 수 있습니다:

type 사용자이름 = string;
type 나이 = number;
type 활성화 = boolean;

let 새사용자: 사용자이름 = "CodingNewbie123";
let 사용자나이: 나이 = 25;
let 계정활성화: 활성화 = true;

이 예제에서 우리는 기본 타입에 대한 별칭을 만들었습니다. 이제 사용자이름은 string의 다른 방법으로, 나이는 number와 같고, 활성화는 boolean과 동일합니다. 이것이 기본 타입에 대해 불필요할 수 있지만, 더 큰 프로젝트에서 코드를 더 읽기 쉽고 의미 있게 만들 수 있습니다.

연합 타입 별칭

이제 한 단계 더 업그레이드 해보겠습니다! 연합 타입은 값이 여러 타입 중 하나일 수 있습니다. 이들에 대한 별칭을 만들 수도 있습니다:

type 상태 = "active" | "inactive" | "suspended";
type 숫자식아이디 = number | string;

let 사용자상태: 상태 = "active";
let 사용자아이디: 숫자식아이디 = 12345;
userId = "USER12345"; // 이것도 유효합니다

여기서 상태는 세 가지 특정 문자열 중 하나만 될 수 있으며, 숫자식아이디는 숫자 또는 문자열일 수 있습니다. 이는 값이 다른 타입일 수 있지만 특정 set 내에서만 사용될 때 매우 유용합니다.

튜플 별칭

튜플은 고정된 개수의 요소를 가진 배열처럼 생각할 수 있습니다. 각 요소는 다른 타입을 가질 수 있습니다. 이를 별칭으로 만들 수도 있습니다:

type 좌표 = [number, number];
type 이름나이 = [string, number];

let 위치: 좌표 = [10, 20];
let 사람: 이름나이 = ["Alice", 30];

이 예제에서 좌표는 항상 두 개의 숫자를 가지고 있으며, 이름나이는 항상 문자열 뒤에 숫자를 가집니다. 이는 데이터가 항상 쌍이나 특정 순서로 오는 경우에 매우 유용합니다.

객체 타입 별칭

객체는 Type Aliases가 진짜 빛을 발하는 곳입니다. 복잡한 타입을 더 쉽게 관리할 수 있게 합니다:

type 사용자 = {
id: number;
name: string;
email: string;
isAdmin: boolean;
};

let 새어드민: 사용자 = {
id: 1,
name: "Super Admin",
email: "[email protected]",
isAdmin: true
};

이제 우리는 그 전체 객체 구조를 매번 작성하지 않고도 User를 사용할 수 있습니다. 마치 우리의 사용자 객체에 대한 블루프린트를 만들었을 때처럼입니다.

함수 타입 별칭

함수 타입에 대한 별칭을 만들 수 있다는 걸 아시나요? 확인해보세요:

type 인사함수 = (name: string) => string;

let 인사: 인사함수 = (name) => `Hello, ${name}!`;

console.log(인사("TypeScript Learner")); // 출력: Hello, TypeScript Learner!

여기서 인사함수는 문자열을 입력받고 문자열을 반환하는 모든 함수에 대한 별칭입니다. 이는 콜백이나 여러 함수 간의 일관성을 유지하고 싶을 때 매우 유용합니다.

제네릭과의 사용

마지막으로 제네릭과 Type Aliases를 사용하는 것에 대해 이야기해보겠습니다. 제네릭은 유연하고 재사용 가능한 코드를 만들 수 있게 해줍니다:

type 컨테이너<T> = { value: T };

let 숫자컨테이너: 컨테이너<number> = { value: 42 };
let 문자열컨테이너: 컨테이너<string> = { value: "Hello, TypeScript!" };

이 예제에서 컨테이너는 임의의 타입의 값을 가질 수 있는 제네릭 타입입니다. 우리는 <T>를 占位자로 사용하고, 실제 타입을 사용할 때 지정합니다.

결론

와우! 오늘 많은 내용을 다루었습니다. Type Aliases는 TypeScript의 신뢰할 수 있는 스위스 아미 Knife와 같습니다 - 코드를 더 깨끗하게, 더 읽기 쉽게, 더 유지하기 쉽게 만들 수 있습니다. 기억해 두세요, 모든 마스터 코더는 초보자로 시작했습니다. 계속 코딩하며 호기심을 유지하고, 행복한 TypeScript 개발을 하세요! ??‍??‍?

Credits: Image by storyset