예제를 통한 TypeScript 고급 유형 설명

TypeScript는 기본 유형을 넘어서는 여러 가지 고급 유형을 제공하여 보다 유연하고 강력한 유형 시스템을 허용합니다. 이러한 고급 유형은 유형 제약 조건을 정의하고 적용하는 추가 방법을 제공하여 견고한 애플리케이션을 만드는 데 도움이 됩니다. 이 문서에서는 이러한 고급 유형 중 일부를 예를 들어 살펴봅니다.

유니온 유형

Union 타입은 변수가 여러 타입 중 하나가 될 수 있도록 합니다. 이는 값이 여러 타입일 수 있지만 실제 타입에 따라 적절하게 처리해야 할 때 유용할 수 있습니다.

// Union type example

function formatValue(value: string | number): string {
  if (typeof value === 'string') {
    return `String: ${value}`;
  } else {
    return `Number: ${value.toFixed(2)}`;
  }
}

console.log(formatValue("Hello"));
console.log(formatValue(123.456));

이 예에서 `formatValue` 함수는 문자열이나 숫자를 받아서 그에 따라 값을 포맷합니다.

교차로 유형

교차 유형은 여러 유형을 하나로 결합합니다. 교차 유형의 객체는 결합된 유형의 모든 속성을 갖습니다. 이는 여러 유형을 함께 구성하는 데 유용합니다.

// Intersection type example

interface Person {
  name: string;
  age: number;
}

interface Contact {
  email: string;
  phone: string;
}

type Employee = Person & Contact;

const employee: Employee = {
  name: "John Doe",
  age: 30,
  email: "john.doe@example.com",
  phone: "123-456-7890"
};

console.log(employee);

여기서 `Employee` 유형은 `Person`과 `Contact`의 교집합입니다. 즉, 두 인터페이스의 속성을 모두 포함하고 있습니다.

리터럴 유형

리터럴 유형은 변수가 보유할 수 있는 정확한 값을 지정합니다. 이는 특정 값만 허용되도록 하는 데 특히 유용할 수 있습니다.

// Literal type example

type Direction = "up" | "down" | "left" | "right";

function move(direction: Direction): void {
  console.log(`Moving ${direction}`);
}

move("up");    // Valid
move("down");  // Valid
// move("side"); // Error: Argument of type '"side"' is not assignable to parameter of type 'Direction'.

여기서 `Direction` 유형은 4개의 특정 문자열 값으로 제한되어 있으므로 `move` 함수에서는 이러한 방향만 사용할 수 있습니다.

튜플 유형

튜플 유형은 각 요소가 다른 유형을 가질 수 있는 고정된 수의 요소가 있는 배열을 나타냅니다. 튜플은 이기종 항목의 고정 크기 컬렉션을 나타내는 데 유용합니다.

// Tuple type example

let user: [string, number] = ["Alice", 30];

console.log(user[0]); // "Alice"
console.log(user[1]); // 30

// user = [30, "Alice"]; // Error: Type 'number' is not assignable to type 'string'.

`user` 튜플은 문자열 뒤에 숫자가 오는 형태로 정의되며, 이 구조는 유지되어야 합니다.

조건 유형

조건부 유형은 조건에 따라 유형을 결정할 수 있게 해줍니다. 조건에 따라 한 유형 또는 다른 유형을 선택하는 방법을 제공합니다.

// Conditional type example

type IsString = T extends string ? "Yes" : "No";

type Test1 = IsString;  // "Yes"
type Test2 = IsString;  // "No"

이 예에서 `IsString` 유형은 `T` 유형이 문자열인지 확인합니다. 문자열이면 `"Yes"`를 반환하고 그렇지 않으면 `"No"`를 반환합니다.

매핑된 유형

매핑된 유형은 기존 유형의 속성을 변환하여 새로운 유형을 만들 수 있게 합니다. 이는 기존 유형을 수정하거나 확장하는 데 유용합니다.

// Mapped type example

type ReadonlyPerson = {
  readonly [K in keyof Person]: Person[K];
};

const readonlyPerson: ReadonlyPerson = {
  name: "Alice",
  age: 30
};

// readonlyPerson.age = 31; // Error: Cannot assign to 'age' because it is a read-only property.

`ReadonlyPerson` 유형은 `Person` 유형의 모든 속성을 읽기 전용으로 만들어서 변환합니다.

결론

TypeScript의 고급 유형은 복잡한 유형 요구 사항을 정의하고 관리하기 위한 강력한 도구를 제공합니다. 개발자는 union, interchange, literal, tuple, conditional 및 mapped 유형을 활용하여 보다 견고하고 유지 관리하기 쉬운 애플리케이션을 만들 수 있습니다. 이러한 유형을 효과적으로 이해하고 적용하면 TypeScript 코드의 유형 안전성과 유연성을 크게 향상시킬 수 있습니다.