TypeScript-섹션7. 제네릭-타입 변수 응용하기(2)

손주완·2025년 7월 14일

Typescript Section7

목록 보기
2/6

✅ 선요약

  • 제네릭은 타입의 재사용성과 정확성을 높이기 위해 사용됨
  • 타입 변수는 여러 개(T, U 등) 동시에 사용할 수 있음
  • 배열, 튜플 등 다양한 타입 구조에 활용 가능
  • extends를 사용하면 타입 변수에 제한(제약 조건)을 걸 수 있음
  • 활용 방법에 따라 타입 추론 정확도타입 안정성이 크게 향상됨

📌 사례 1: 두 개의 타입 변수 사용

function swap<T, U>(a: T, b: U) {
  return [b, a];
}

const [a, b] = swap("1", 2);
// a: number, b: string
  • T = string, U = number로 추론됨
  • 여러 타입을 동시에 사용할 수 있음

📌 사례 2: 제네릭 배열

function returnFirstValue<T>(data: T[]) {
  return data[0];
}

let num = returnFirstValue([0, 1, 2]); 
// number

let str = returnFirstValue([1, "hello", "mynameis"]); 
// number | string
  • T[]를 매개변수 타입으로 설정하면 T는 요소의 타입으로 추론됨
  • 혼합된 타입 배열의 경우 Tnumber | string

📌 사례 3: 튜플 타입으로 첫 번째 요소 추론

function returnFirstValue<T>(data: [T, ...unknown[]]) {
  return data[0];
}

let str = returnFirstValue([1, "hello", "mynameis"]);
// number
  • 첫 번째 요소의 타입만 T로 고정
  • 나머지 요소는 어떤 타입이든 상관없음 (...unknown[])

📌 사례 4: 타입 변수 제한 (extends)

function getLength<T extends { length: number }>(data: T) {
  return data.length;
}

getLength("123");            // ✅ OK
getLength([1, 2, 3]);        // ✅ OK
getLength({ length: 1 });    // ✅ OK
getLength(undefined);        // ❌ 오류
getLength(null);             // ❌ 오류
  • T extends { length: number }는 T가 최소한 length 프로퍼티를 가지고 있어야 함
  • 타입 안정성을 위해 필요한 제약 조건

✅ 마무리

제네릭은 단순히 타입을 일반화하는 것이 아니라
상황에 맞는 타입 정확성과 제한을 추가하는 도구이다.
적절히 활용하면 코드의 안정성과 유연성이 크게 향상된다.

0개의 댓글