TypeScript의 유니언 타입: 코드의 유연성과 안전성을 높이는 방법

TypeScript는 정적 타입 언어로, 개발자에게 코드의 안정성과 가독성을 높일 수 있는 다양한 기능을 제공합니다. 그 중에서도 유니언 타입은 여러 데이터 유형을 하나의 변수에 결합할 수 있는 강력한 도구입니다. 이번 포스트에서는 유니언 타입의 기본 개념부터 활용 사례, 조건부 검사까지 자세히 살펴보겠습니다.

1. 유니언 타입의 기본 개념

유니언 타입은 | 기호를 사용하여 두 개 이상의 데이터 유형을 결합하는 방식으로 정의됩니다. 예를 들어, 변수가 문자열 또는 숫자일 수 있다고 가정해봅시다. 이 경우, 해당 변수는 두 가지 데이터 유형 중 하나를 가질 수 있습니다.

let value: string | number;

value = "Hello"; // 올바른 할당
value = 42;     // 올바른 할당
// value = true; // 오류 발생: boolean은 허용되지 않음

위의 예제에서 value는 문자열 혹은 숫자를 가질 수 있지만, 다른 유형인 불리언(boolean)이나 객체는 허용되지 않습니다. 이러한 제한은 코드의 오류를 줄이고, 개발자가 의도한 대로만 데이터를 처리할 수 있도록 도와줍니다.

2. 유니언 타입의 활용 사례

유니언 타입은 함수의 매개변수나 반환값에 매우 유용하게 활용될 수 있습니다. 다음과 같은 함수를 생각해 봅시다:

function printId(id: number | string) {
    console.log("Your ID is: " + id);
}

printId(101);      // 출력: Your ID is: 101
printId("202");    // 출력: Your ID is: 202

위의 printId 함수는 매개변수 id가 숫자 또는 문자열로 전달될 수 있음을 나타냅니다. 이처럼 유니언 타입을 사용하면 함수가 다양한 데이터 유형을 수용할 수 있어, 코드의 재사용성을 높이고, 다양한 상황에 맞춰 유연하게 대응할 수 있습니다.

3. 배열과 함께 사용하기

유니언 타입은 배열에서도 효과적으로 사용할 수 있습니다. 아래와 같이 다양한 데이터 유형을 포함하는 배열을 만들 수 있습니다.

let mixedArray: (string | number)[] = ["apple", 1, "banana", 2];

mixedArray.push("cherry"); // 올바른 추가
mixedArray.push(3);        // 올바른 추가
// mixedArray.push(true);   // 오류 발생 : boolean은 허용되지 않음 

여기서 mixedArray는 문자열과 숫자만 포함할 수 있으며, 그 외의 데이터형태는 추가할 수 없습니다. 이러한 배열을 사용하면 다양한 데이터 유형을 한 곳에 모아 관리할 수 있어, 데이터 처리의 효율성을 높일 수 있습니다.

4. 객체와 함께 사용하기

유니언 타입은 객체의 속성에도 적용될 수 있습니다. 다음과 같은 예제를 살펴보겠습니다:

type User = {
    name: string;
    age: number;
} | {
    username: string;
    email?: string; 
};

const user1: User = { name: "Alice", age: 30 };
const user2: User = { username: "Bob" };
const user3: User = { username:"Charlie", email:"charlie@example.com" };

// const user4 : User= {name:"Dave"}; // 오류 발생 : name 속성이 없음.

위 예제에서 User라는 사용자 정의 유형이 두 가지 형태로 정의되어 있어, 각기 다른 구조를 가진 사용자 정보를 표현할 수 있습니다. 이러한 유연성 덕분에 다양한 사용자 정보를 효과적으로 관리하고, 필요에 따라 적절한 속성을 선택하여 사용할 수 있습니다.

5. 조건부 검사 및 보호

유니언 타입을 사용할 때에는 해당 값이 실제로 어떤 형인지 확인해야 합니다. 이를 통해 코드의 안정성을 더욱 높일 수 있습니다:

function logValue(value: string | number) {
    if (typeof value === 'string') {
        console.log("String value:", value);
    } else {
        console.log("Number value:", value);
    }
}

logValue("Hello!"); // 출력 : String value : Hello!
logValue(100);      // 출력 : Number value : 100 

여기서는 typeof 연산자를 이용하여 입력된 값의 실제 데이터형을 확인하고, 적절한 로직을 수행합니다. 이러한 조건부 검사는 코드의 오류를 사전에 방지하고, 예기치 않은 상황에서도 안정적으로 작동할 수 있도록 도와줍니다.

요약

고급 타이핑 기술 중 유니언 타입은 코드의 재사용성과 안정성을 높이는 데 중요한 역할을 합니다. 여러 종류의 데이터를 처리해야 하는 상황에서 특히 유용하며, TypeScript가 제공하는 정적 타입 검사의 이점을 활용해 더욱 견고한 애플리케이션 개발에 기여합니다. 유니언 타입을 적절히 활용하면, 개발자는 다양한 데이터 유형을 효과적으로 관리하고, 코드의 가독성과 유지보수성을 높일 수 있습니다.