Home [TS] 타입스크립트 첫걸음 6편(Generics)
Post
Cancel

[TS] 타입스크립트 첫걸음 6편(Generics)

제네릭 (Generics)

제네릭은 C#, Java 등의 언어에서 재사용률이 높은 컴포넌트를 만들 때 자주 활용되는 특징. 특히 한가지 타입보다 여러 가지 타입에서 동작하는 컴포넌트를 생성하는데 사용된다.

제네릭이란?

제네릭이란 타입을 마치 함수의 파라미터처럼 사용하는 것을 의미한다.

1
2
3
function getText<T>(text: T): T {
  return text;
}

위 함수는 제네릭 기본 문법이 적용된 형태다. 이제 함수를 호출할 때 아래와 같이 함수 안에서 사용할 타입을 넘겨줄 수 있다.

1
2
3
getText<string>("hi");
getText<number>(10);
getText<boolean>(true);

위 코드 중 getText<string>('hi') 를 호출 했을 때 함수에서 제네릭이 어떻게 동작하는지 살펴보자.

1
2
3
function getText<string>(text: T): T {
  return text;
}

위 함수에서 제네릭 타입이 <string> 이 되는 이유는 getText() 함수를 호출할 때 제네릭(함수에서 사용할 타입) 값으로 string을 넘겼기 때문이다.

1
getText<string>("hi");
1
2
3
function getText<string>(text: string): string {
  return text;
}

위 함수는 입력값의 타입이 string 이면서 반환 값 타입도 string 이어야 한다.

This post is licensed under CC BY 4.0 by the author.

[CSS] React에서 텍스트 줄바꿈(whitespace: pre-wrap)

[Nextjs] Next에서 _app, _document에 대해서