본문 바로가기
Q&A해결2025년 6월 9일1분 읽기

TypeScript 제네릭 제약 조건 패턴

서
서버지기영호
조회 1230댓글 5

TypeScript 제네릭 제약 조건 패턴 관련 타입 에러입니다.

아래 코드에서 TypeScript가 타입을 제대로 추론하지 못합니다:

function fetchData<T>(url: string): Promise<T> {
  return fetch(url).then(r => r.json())
}

const data = await fetchData('/api/users')
// data가 unknown 타입으로 추론됨

제네릭 T가 자동으로 추론되지 않는 이유가 뭔가요?

이전 글
PostgreSQL Logical Replication 설정
다음 글
Podman Docker 대안으로 쓸만한가

댓글 5

김김영삼1년 전

TypeScript는 런타임 응답에서 타입을 추론할 수 없습니다. 호출 시 명시적으로 타입을 지정해야 합니다:

// 방법 1: 호출 시 제네릭 지정
interface User { id: number; name: string; email: string }
const users = await fetchData<User[]>('/api/users')

// 방법 2: Zod로 런타임 검증 + 타입 추론
import { z } from 'zod'
const UserSchema = z.object({
  id: z.number(),
  name: z.string(),
  email: z.string().email(),
})
type User = z.infer<typeof UserSchema>

const data = await fetch('/api/users').then(r => r.json())
const users = z.array(UserSchema).parse(data)  // 런타임 검증 + 타입 안전

Zod를 쓰면 런타임 검증과 타입 추론을 동시에 할 수 있어 가장 안전합니다.

서서버지기영호1년 전

한 가지 더 여쭤봐도 될까요

실제로 프로덕션에서 적용할 때 주의할 점이 있을까요?

김김영삼1년 전

추가 질문에 답변드립니다.

말씀하신 경우에는 상황에 따라 다르지만, 일반적으로는 공식 문서의 권장 방식을 따르는 것이 가장 안전합니다. 실무에서는 팀 규모와 프로젝트 특성에 맞게 조정하시면 됩니다.

보보안전문가태호1년 전

저는 이렇게 쓰고 있어요 TypeScript 제네릭 제약 조건... 관련해서는 공식 문서 외에 실전 경험이 중요한 것 같습니다.

서서버지기영호1년 전
정리 감사합니다!
Ctrl+Enter로 등록