[typescript] 나는 제네릭을 아는가?

문제

묵혀둔 Next.js 게시판 프로젝트를 고치면서

첫 todo는 바로 any 타입 고치기였다.

 

온갖 구글링을 통해 제공되는 타입 설정 까지는 어떻게든 해냈는데

도저히 무엇이 문제인지 모르겠는 타입 설정이 하나 있었다.

 

해당 에러 메세지는 변수 posts가

타입 WithId <Document>[]가 타입 Post []에 할당될 수 없다고 뜬다.

 

그러니까 await db~ 로 출력된 결괏값이 WithId <Document>[] 타입이고

그 값을 할당하려는 변수 타입을 Post []로 설정해 주어 생긴 타입호환성 오류였다.

 

해결

그렇다면 출력된 결과 값을 Post로 설정해 주면 해결되는데

제네릭에 대한 이해가 부족했던 나는 한참을 헤맸다.

 

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

 

MongoDB에서 'post'로 정의된 collection 데이터를 들고 오는 메소드 collection에

interface로 정의된 타입 Post를 제네릭으로 설정해주면

 

POST 컬렉션에서 데이터를 가져올 때 해당 데이터가

'Post' 타입과 일치해야한다는 것을 타입스크립트에게 알려준다.

 

이것은 타입스크립트가 collection 메소드에서 반환되는

데이터의 형태를 추론하고 변수 post의 타입을 Post[]로 설정할 수 있도록 한다. 

결론

처음엔 WithId 라는 타입에 꽂혀 import 해서 직접 지정해보고

GPT한테 직접적으로 물어보기도 했는데 해결할 수 없었다.

하지만 결국 에러 메세지를 제대로 읽으면 해결할 수 있는 문제였다.

interface와 type 별칭만 주구장창 사용하던 과거의 나를 반성하고

프로젝트를 천천히 살펴보면서 typescript공부를 더 해나야겠다!