작업 도중 비효율적인 상황이 나와서 진도를 조금 늦추는 한이 있어도 중간 리팩토링을 하고 진행하겠다. 이벤트메이커 컴포넌트를 만들고 컨디션메이커를 관리하는 중에 발생했다.
getOptionBool로 현재 라디오값을 체크하여 추가 컴포넌트를 구현하고 있는데, 이것이 너무 쌓이다보니 가독성도 떨어지고 수치를 고치는 것도 문제였다. 처음엔 서너개만 만들어두면 될 줄 알았는데, 이 게임의 AI 로직을 클론코딩해보니 예외사항들이 자꾸 툭툭 튀어나서 계속 늘어나게 되었다. 이 문제를 해결하기 위해선
1. 바뀌는 라디오값을 바로바로 반영할 수 있으면서
2. 예외상황을 만들지 않고 작동할 수 있어야하며
3. 가독성을 높이면서 효율을 높이는 코드
를 만들어야한다. 가장 먼저 생각나는 부분은
로그 확인을 위해 만들어둔 useEffect 문을 활용하는 것이다.
SelectButton은 라디오버튼 컴포넌트로, 너비값, 옵션값, 정렬순서, 리코일값, 온체인지가 넘어가야한다. 그럼 여기서 배열을 만들어 값을 할당한다고 치면, 너비값은 당장은 쓰이지 않지만 변경 가능성이 높아서 남겨두었으니 유지, 옵션값은 SelectButton의 라디오값을 체크해야하니 유지, 정렬순서 역시 유지, 리코일값과 온체인지는 변경요소가 하나도 없으니 예외하면 되겠다.
너비값은 num, 옵션값은 string, 정렬순서는 num이니 string 배열로 만들고 숫자변환을 사용하면 될 것 같다.
일단 라디오 버튼에 있는 케이스를 다 긁어온다. 중첩되는 것들을 한 번에 줄이고, 정렬순서에 따라 순서가 뒷번인 것이 UI상으로는 앞쪽에 위치하기도 하니까 그 부분을 감안해야한다.
여전히 긴 코드같아보이지만 사실상 발생할 수 있는 모든 이벤트에 대응하는 스위치문이다. 덕분에
구현부 코드의 길이를 훨씬 짧게 만들 수 있었다. 그리고 여기까지 왔을 때, 라디오 버튼 구현부에서 일부 라디오값이 제대로 바뀌지 않는 것을 확인했다.....자기 전에 빠르게 고치고 자야겠다