[TS] Generic 타입 기초

우리는 TypeScript를 사용해 오며 기본적으로 변수에 타입을 지정할 때 아래와 같이 할 것이다.

const 상수:number = 2;
let 스트링배열: string[] = ['1','2','3']

 

하지만 이렇게하면 타입이 고정되기 때문에 유연하지 않다. 그래서 우리는 여기에 유연성을 가미한 유니온 타입을 사용한다.

const 하이: number | string | string[];

 

위를 보면 하이라는 상수에는 숫자,문자열,문자열배열이 들어올 수 있다. 하지만 프로그래밍을 하다 보면 내가 의도한 타입대로

흘러가지 않을수도 있고 그걸 방지하기 위해 유니온타입을 너무 많이 사용하면 타입 안전성이 보장되지 않는다.

 

그럼 어떻게 해야할까?  그럴 땐 Generic타입이 도움이 될 수 있다.

 

Generic 타입이란

타입을 고정된 값으로 명시하는게 아닌 변수를 통해 언제든지 변할 수 있는 타입을 제공하여 보다 유연하게

코딩할 수 있게 도와주는 것이다.

 

한마디로 타입을 변수화 한 것이다.

 

예를 들어보자

function add(x: string | number, y: string | number): string | number {
   return x + y;
}

add(1,2);
add('이정우','존잘');

 

위 와같이 add라는 함수를 정의하고 인자인 x, y둘다 유니온타입을 이용해 문자열 또는 숫자로 받아보자.

 

위와 같이 add를 호출하면 결과가 잘 나올것이다.

하지만 x와 y의 타입을 각각 다르게 넘길 수도 있는 유니온함정이 걸릴 수 도 있다.

 

이를 Generic 타입을 이용해 해결해 보자

 

function add<T>(x: T, y: Y):T { 
  return x + y
}

add<number>(1,2);
add<string>('hello', 'world');

 

Generic 타입을 이용하려면 꺽쇠와 문자 T를 시용해 표현한다.

또한 Generic 타입 함수를 호출할 때 <number>라고 정해주면, 함수의 T부분이 number로 바뀌며 실행된다.

 

any와 Generic의 차이

둘 다 타입을 모를 때를 대비해 사용하는 것인데 왜 Generic인가?

 

any타입은 말 그대로 어떤 것도 될 수 있는 타입이다.

그렇기 때문에 타입스크립트의 보호를 받지 못한다는 점이 가장 큰 단점이다.

그렇기 때문에 말도 안 되는 코드에서도 오류가 나지 않는다.

 

Generic은 선언시점이 아닌 사용시점에서 타입을 지정하기 때문에 타입을 any보다 더 낫다고 할 수 있다.

 

마치며

이번 블로그는 제네릭이 뭔지 이해만 할 수 있게끔 적었는데 다음블로그는 제네릭을 더 사용해 보며

심화적으로 적어봐야겠다.