본문 바로가기

개발

TypeScript 제너릭

 

 

제네릭 타입을 사용하는 함수는 호출 시 타입을 명시적으로 지정할 수 있다.

function identityGeneric<T>(arg: T): T {
  return arg;
}

// 함수 호출 시 타입을 명시적으로 지정
let output1 = identityGeneric<string>("Hello");

console.log(output1); // "Hello"


identityGeneric<string>("Hello") 부분에서

<string>으로 타입을 명시함으로써, 함수가 문자열 타입의 인자를 받고 문자열 타입을 반환할 것임을 명확하게 알 수 있다.

함수 호출 시 전달된 인자에 따라 타입을 추론할 수도 있다.

타입을 명시적으로 지정하지 않아도 올바른 타입이 추론된다.

let output2 = identityGeneric("Hello");

console.log(output2); // "Hello"


위 코드에서는 identityGeneric 함수를 호출할 때 타입을 명시적으로 지정하지 않았지만, 타입스크립트가 전달된 인자 "Hello"의 타입이 string임을 추론하여 T가 string임을 알게 된다.

 

두번째 방법이 코드도 더 짧고 가독성이 좋기 때문에 흔하게 사용되지만, 복잡한 코드의 경우 타입이 올바르게 추론되지 않을 수 있으므로 첫번째 방법이 선호되기도 한다.

 

 

🚨 경고 발생 시

function logText<T>(text: Array<T>): Array<T> {
  console.log(text.length);
  return text;
}

 

참고: https://joshua1988.github.io/ts/guide/generics.html

 

 

 

 

 

 

'개발' 카테고리의 다른 글

vercel 백엔드 배포 시 주의사항  (2) 2024.07.14
SOLID  (0) 2024.07.12
쿠키와 웹 스토리지  (0) 2024.07.11
Shadcn UI와 Icons  (0) 2024.07.11
React Hook Form  (1) 2024.07.10