[TS] 'prev' is possibly 'undefined'.

heart 값에 따라서 state를 바꿔주고 싶은데 prev에 undefined가 들어올 수도 있기 때문에 안된다고 에러가 떴다.

heart
  ? setCountLikes((prev) => prev - 1)
  : setCountLikes((prev) => prev + 1);

(parameter) prev: number | undefined
'prev' is possibly 'undefined'.

'prev' is possibly 'undefined'.

---

이유

undefined이 들어왔을 때를 대비해 처리해주면 되는데 countLikes나 typeof 연산자로 조건으로 If문을 사용하면 prev와 달라서 그런지 빨간 줄이 사라지지 않았다. 그래도 아래의 방법들로 해결할 수 있었다.

 

keyword as

heart
? setCountLikes((prev) => prev as number - 1)
: setCountLikes((prev) => prev as number + 1);

 

|| 연산자

heart
? setCountLikes((prev) => (prev || 1) - 1)
: setCountLikes((prev) => (prev || 0) + 1);

 

non-null assertion (이 중 제일 추천하지 않는 방법)

heart
? setCountLikes((prev) => prev! - 1)
: setCountLikes((prev) => prev! + 1);

 

Null 병합 연산자

heart
? setCountLikes((prev) => (prev ?? 1) - 1)
: setCountLikes((prev) => (prev ?? 0) + 1);

 

참고