[TS]Generic Basic

함수를 만들어보자.
홀화살괄호 내에는 T뿐만아니라 2개, 여러 개를 포함시킬 수 있다.

function helloGeneric<T, U, K>

T, U, K 는 함수 내에서 유효한 제네릭이다.

작성하는 방법은 클래스, array, 함수 등 더 많아질 수 있으나 사용하는 방법은 명확하다.

function helloGeneric<T>(message: T): T{
	return message;
}

helloGeneric<string>("Hey"); 
helloGeneric<string>(39); // Error

string으로 타입을 지정했으니, 39라는 숫자를 넣으면 에러가 뜬다.

제네릭을 가져다써서 변수처럼 지정해 쓰는 방식과 그렇지 않은 방식이 있다.

helloGeneric<string>("Hey");

(string으로 지정된다.)

helloGeneric(36);

(36으로 지정된다.)
위와 같이 제네릭을 쓰지 않으면 <T>가 자동적으로 추론이 된다. 추론 규정에 따라서 T가 36이 된다.
우리의 생각으로는 36이면 Number로 출력이 되어야 한다고 생각하겠지만 TypeScript는 가장 좁은 범위의 타이핑을 추론하기 때문에 36을 넣게 되면 T 자체는 36이 된다. 결과물인 return type도 36이 된다.

그러니, 넣어서 사용하면 <T>뒤의 인자가 제한이 되고, 넣지 않고 사용하면 <T>가 추론된다고 이해하면 된다.

또한, 아래 그림과 같이 T뿐만 아니라 더 많은 인자를 넣어줄 수 있다.

현재, U를 리턴타입에 사용하지 않고 있기에 의미가 없긴 하지만 T와 조합해서 사용하면 의미가 있을 수 있다.

위와 같이 두 가지 제네릭을 사용하는 경우엔

인자를 U까지 채워라는 에러 메세지가 발생하는 것을 볼 수 있다.

string, number로 T, U 를 채워 주었고, 인자로 "Hey"와 12를 넣어주니 에러가 사라졌다.

또한 변수를 지정하지 않은 방식 또한 21, 31을 넣어줌으로써 T, U를 21, 31로 만들어 주었다.