[타입스크립트] generic에 대하여

generic타입 : 

함수에서 타입을 지정해줄 때, 타입파라미터를 통해서 자유롭게 함수내에서 사용하는 타입을 정해줄 수 있는 방법이 있다. 

이것을 generic타입이라고 부른다. 

이 타입을 활용하면, 한 가지 타입에만 제한되지 않고 다양한 타입을 함수마다 적용해서 사용할 수 있다. 

때문에 확장성도 넓다. 

 

바로 예시부터 확인해보자. 

function 함수<MyType>(x: MyType[]) :MyType { return x[0]; } 
let a = 함수<number>([4,2]) 
let b = 함수<string>(['kim', 'park'])

위의 코드를 보면, 함수<generic>()과 같은 방식으로 generic 타입을 선언할 수 있다. 이렇게 선언하고 난 타입은 

함수를 호출 할 때, 타입을 파라미터에 넣어주면된다. 

변수 a의 경우에는 generic의 타입을 number로 지정해주었다. 

 

이때, 우리가 확인할 수 있는 것은, 이 generic타입을 파라미터에도 넣어줄 수 있고, 함수의 반환값에도 넣어줄 수 있다는 것이다. 

그리고 변수 a에서는 number로 선언을 했지만, 

변수 b에서는 string으로 선언한 것을 볼 수 있다. 

이렇게 generic타입을 활용하면, 높은 확장성과 재사용가능성을 보여준다.

---

extens 키워드 : 

function 함수<MyType>(x: MyType) {
  return x - 1
}

let a = 함수<number>(100)

이렇게 코드를 작성한 경우, x에 에러표시가 나게 된다. 

아래에서 함수를 호출 할 때 비록 number를 입력해주고 있다고 할지라도, 

자바스크립트 실행기는 위에서부터 차근차근 읽어내려오며, 위에서부터 미리 문제를 감지하기 때문에 

나중에 number로 타입을 지정해주었다 할지라도, x는 불안정한 상황이다. 

x에 number가 들어올지, string이 들어올 지 알 수가 없는 상황이기 때문이다. 

 

이런 상황에 대비해 우리는 extends라는 키워드를 사용할 수 있다. 

function 함수<MyType extends number>(x: MyType) {
  return x - 1
}

let a = 함수<number>(100) //잘됩니다

 

 

extends를 사용하면, generic 타입을 제한할 수 있다.

extends 오른쪽에 있는 속성으로만 제한하겠다는 의미를 가지고 있다. . 

위의 경우 넘버인지 체크를 하는 행위를 통해서 ,

일종의 narrowing을 하는 것이기 때문에, 에러가 나지 않는다.