ts
CHAPTER 8 / 34
읽기 약 2분
SYNTAX
제네릭 해부: 타입 파라미터 시스템
핵심 개념
제네릭은 타입을 파라미터처럼 전달하는 기능입니다. <T>로 타입 파라미터를 선언하고 호출 시 타입을 지정합니다. 재사용 가능한 타입 안전 함수/클래스/인터페이스를 만들 수 있습니다. 제네릭을 지우며 타입 안전 재사용이 어떻게 사라지는지 확인하십시오.
코드 분석
// 제네릭 시뮬레이션
// function identity<T>(arg: T): T { return arg; }
function identity(arg) { return arg; } // T 제거 시
// function getFirst<T>(arr: T[]): T | undefined { return arr[0]; }
function getFirst(arr) { return arr[0]; }
// interface ApiResponse<T> { data: T; status: number; message: string; }
function createResponse(data) { return { data, status: 200, message: 'OK' }; }
const results = [
{ desc: 'identity<string>("T-800")', result: identity('T-800'), type: typeof identity('T-800') },
{ desc: 'identity<number>(800)', result: identity(800), type: typeof identity(800) },
{ desc: 'getFirst<string>(["T-800","T-1000"])', result: getFirst(['T-800','T-1000']), type: 'string' },
];
results.forEach(r => {
const el = document.createElement('div');
el.style.marginBottom = '6px'; el.style.fontSize = '11px';
el.innerHTML = `<span style="color:#888;">${r.desc}</span><br><span style="color:#22c55e;">→ ${r.result} (${r.type})</span>`;
document.currentScript.parentElement.appendChild(el);
});AI 프롬프트
🤖 AI에게 잘 물어보는 법 — 모델·전략별 프롬프트
Claude
무료: Sonnet 4.6 / Pro $20/mo: Opus 4.6
이 TS '제네릭' 코드에서 타입 에러·any 남용·타입 안전성 누락을 찾아 엄격한 타입으로 리팩토링해줘.
ChatGPT
무료: GPT-5.5 / Plus $20/mo: GPT-5.5 Pro
'제네릭'를 실무에서 사용하는 패턴 3가지를 비교표로 보여주고 각각의 적합한 케이스를 알려줘.
Gemini
무료: 2.5 Flash / Pro $19.99/mo: 3.1 Pro
이 TS '제네릭' 관련 코드 전체의 타입 구조를 분석하고 제네릭·유틸리티 타입으로 개선할 포인트를 정리해줘.
Grok
무료: Grok 4.1 / SuperGrok $30/mo
TypeScript '제네릭'를 꼭 써야 하는지 개발 속도 vs 안전성 관점에서 솔직하게 평가해줘.
⭐ 이것만 기억하세요
제네릭 해부: 타입 파라미터 시스템은 이 3가지만 확실히 잡으세요
1.함수마다 타입별로 오버로드를 만들면 string용, number용, boolean용 동일한 로직이 3벌로 중복됩니다
2.제네릭<T>는 호출 시점에 타입을 결정하는 파라미터로, 하나의 함수·클래스·인터페이스가 여러 타입에서 동작합니다
3.다음 챕터에서 하나의 값이 여러 타입 중 하나일 수 있는 유니온 타입을 배웁니다
공유하기
진행도 8 / 34