[React] TypeError : undefined is not a function

에러 발생

프로젝트를 하던중에 위와 같은 에러를 떴다. 저 에러가 뜨는 이유는 알고있지만 왜 뜨는지는 이해할 수가 없었다. 아래가 처음 작성한 코드이다.

axios요청으로 서버에서 댓글을 받아오는데 댓글이 없으면 undefined로 바뀌는것을 확인 할 수 있었다. 내가 알기로 undefined는 false이기에 24번째 줄의 삼항연산자에서 : 뒤의 피연산자들이 실행되어야 한다고 생각했는데 무슨 이유인지 그렇게 되지 않고 ? 뒤의 피연산자들이 실행되면 제일 처음 사진의 에러를 발생시켰다.

문제 해결

댓글이 있다면 Array로 들어오기 때문에 일단 useState의 기본값을 [] 로 바꿔주었다. 또한, 삼항 연산자의 조건을 단순 comments의 length로 바꾸어 좀 더 명시적으로 분기를 하였고 이를 통해 에러도 방지할 수 있었다.
이때까지 useState의 기본값을 생각없이 주었다는것과 중요성을 깨닫게 되었다.