[오류해결] TS2349: This expression is not callable 에러

💥 발생

원티드 프론트엔드 챌린지 종료 후 못한 과제를 끝까지 끝내고 싶어서 도전 중 다음과 같은 오류를 만남

TS2349:&nbsp;This&nbsp;expression&nbsp;is&nbsp;not&nbsp;callable.&nbsp;&nbsp;&nbsp;Type&nbsp;'[any,&nbsp;Dispatch<any>]'&nbsp;has&nbsp;no&nbsp;call&nbsp;signatures.

type Todo ----

export type Todo = {
    title?: string | undefined;
    contents?: string | undefined;
}

🧑‍💻 문제 확인

TS2349: This expression is not callable.   Type '[any, Dispatch<any>]' has no call signatures. 요 에러 속에 답이 있다고 판단 후 우리의 친구 파파고를 돌려 다음과 같은 번역을 받을 수 있었다.

음.... 이게 무슨 소리지... 호출 서명이 없다..?

🤔 문제 해결 과정

1. 잘못된 타입 선언 

잘보니깐 Componet랑 Type 이랑 이름이 같다.. 이런...?

급하게 Todo Type 명을 불편하지만 TodoData 로 변경  

네이밍... 불편... 🤨

결과... 큰 변화 없음

우선 잘못된 형식이였기에 네이밍은 불편하지만 이대로 유지.

🤔🤔🤔🤔 무엇이 문제인고..... 해서 깃헙에도 검색해보았지만 아직 깃헙 검색 초보라서 구글로 검색을 해봄. 

그런데!!!

누가 이미 동일하게 구현해둔게 있음 무엇이 문제인고 잘 확인해보니 각 변수 Key 값명에 '?'를 넣어둔게 문제로 보임

👨&zwj;🔧 👨&zwj;🔧 👨&zwj;🔧 빠른 수정

... 결과는??? 에러남

근데 잘 보니깐 뭔가 이상한 에러가 껴있다??

TS2693: 'TodoData' only refers to a type, but is being used as a value here. (?) 

무슨 에러지...? 천천히 해석해보니깐.. 

'TodoData'는 오로지 Type 형태로 참조할 수 있습니다. 하지만 여기서는 값으로써 활용되고있습니다.

😃 문제 해결

... 잘 읽고 코딩한 것을 잘 보니 문법 실수였다.

( 초기 파파고에서 해석한 것도 사실은  '이 식은 호출할 수 없습니다' -> 이런 문법 없어.. 자쓱아..  이 뜻이 아니였을까..?)

무엇이 문제일까요~?

잘 보니깐 ()() 로 값을 할당하는 '()'가 두번 들어가서 문제가 발생한 현상이였다 

급하게 <>() 로 수정해보았다.

오... 에러 없어짐

 

🧎 반성할 점

오늘 에러로 인해 두가지 큰 교훈을 얻게되었다.

1. 변수명 똑바로 짓자 ( Component 명과 동일 했음 )

2. 내가 사용한 코드를 더 꼼꼼하게 잘 보자 ( '()()' -> '<>()' )

🎓 배운점 

1. 에러의 메시지를 꼭 읽어보고

2. 작성한 코드를 다시 한 번 확인해보자

 

---

👣 흔적

깃헙 검색 흔적

구글 검색 후 찾은 것