[TS] 제너릭

 

function hello(arg: any): any {
    return arg;
}

 

인수에 관계 없이 그 값을 returng하는 함수 hello를 만든다고 하자.

JS에서는 타입 구분이 크지 않기에 상관 없지만, TS에서는 타입을 구분되어 있기 때문에

인수에 관계 없이 값을 가져오기 위해서는 인수에 들어올 수 있는 모든 타입을 지정해주어야한다.

이는 몹시 귀찮고 힘들다.

 

다른 방법으로는 any 타입을 이용해 인수를 받을 수 있지만

인수가 any 타입으로 불러와지기 때문에 인수가 원래 어떤 자료형이었는지 대한 정보를 잃어버린다.

 

귀찮지도 않고 원본 자료형에 대한 정보를 둘 다 처리할 수 있는 방법이 제너릭(Generic)이다.

 

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

 

제너릭을 사용하기 위해서는 타입 변수 T를 사용한다.

타입 변수는 말 그대로 타입 정보를 담는 변수로

선언 시 꺽쇠 괄호(<>) 안에 선언되며 타입을 지정하는 콜론(:) 뒤에 타입처럼 쓰인다.

사용 할 때는 두 가지 방법으로 쓰일 수 있는데,

 

let output = hello("Hello");

 

과 같이 평소대로 작성하면 컴파일러가 알아서 "Hello"라는 인수가 string임을 캐치하고 T에 string을 넣어주는 경우,

 

let output = hello<string>("Hello");

 

그리고 위와 같이 <>를 통하여 타입을 명시적으로 지정해주는 방법이 있다.

함수가 복잡해질 경우 컴파일러가 혼돈이 올 수 있기 때문에 명시적으로 지정해주어야할 경우가 생길 수 있다.

 

 

참고

 

TypeScript Handbook 한글 문서 - 제너릭