만난 문제
함수와 변수를 한 두개 만들 때는 이름을 짓는 데 큰 어려움이 없었는데, 함수와 변수를 20개, 30개가 넘게 만들다보니 이름을 짓는 것이 큰 과제가 되었다. 규칙을 정하지 않고 이름을 만들다보니, 어떤 함수는 그냥 handleDelete(목적어 없음), 어떤 함수는 handleDeleteReference(동사+목적어 순), 어떤 함수는 handleAssignmentDelete(목적어+동사 순).. 어떨 때는 handle을 쓰고, 또 어떨 때는 handle을 안 쓰는 등.. 이름이 중구난방이라 작명한 나조차도 머리가 어지러웠다.
문제 해결 방법
👉 함수와 변수 이름 잘 짓는 법
(1) 목적어 + 동사 순으로 적을지, 동사 + 목적어 순으로 적을지 정하기
영어 어순이 원래 동사 + 목적어 이니, 이 순서가 낫지 않을까?
(2) be 동사와 일반 동사로 변수와 함수 구분하기
변수에는 is를, 함수에는 일반 동사를 사용한다.
(참고: https://learningspoons.com/website/blog/detail/7-tips-for-naming-your-variables-and-functions/)
(3) 한 기능은 한 단어로만 쓰기
어떤 값을 가져오는 함수가 여러개 있다면 get, find 등의 여러가지 동사를 사용해 이름을 짓는 대신 get 하나만 사용해서 같은 기능을 하는 함수에 일관성을 부여한다.
(4) 자주 사용할수록 짧고 쉽게 짓기
해당 함수 혹은 변수, 상수를 여러 곳에서 사용한다면 검색하기 쉽고 짧은 이름으로 짓는 것이 좋다.
(참고: https://ittrue.tistory.com/336#google_vignette)
(5) 리액트 이벤트 핸들러 관련 prop 이름은 on로, 함수 이름은 handle로 짓기
on 접두사가 붙은 경우 이 prop에 실제 이벤트가 연결되어 있다는 걸 뜻하고, handle 접두사가 붙은 경우 이벤트가 발생했을 때 호출되는 실제 Function을 의미한다.
<MyComponent
onAlertClick={handleAlertClick}
onFormSubmit={handleFormSubmit}
/>(참고: https://ellie-dev.tistory.com/13)
😙 앞으로는 다른 사람들의 코드를 볼 때, 함수나 변수 이름을 짓는 방식을 잘 살펴보아야겠다!
