숫자야구게임만들기(3)- error처리

1. 서론

 

기능별로 나누는 연습을 하고 있기 때문에

저는 에러가 맞는지 확인하는 파일과 에러 메시지를 띄우는 파일로 나누어 주었습니다.

그리고 메인 index.js에서 사용하기 위해 리턴값을 Boolean값으로 정해주기로 하였습니다.

---

2. ErrorValidator.js

함수의 이름으로 아실 수 있겠지만 3가지로 나누어 놓았습니다.

 

1. 숫자가 3개가 아닌 경우

2. 숫자가 중복되었을 경우

3. 숫자가 아닐 경우

 

1. 숫자가 3개가 아닌 경우는 간단하게 length를 이용하여 비교하였습니다.

2. 중복인 경우는 Set함수를 이용해 원래의 길이와 맞는지 비교하여 판단하였습니다.

3. 숫자가 아닌 경우는 isNaN을 이용해 숫자가 맞는지 판단하였습니다.

 

여기서 isNaN은 문자열이여도 그 문자열이 숫자로 구성되어 있는지 확인할 수 있습니다.

 

---

3. ErrorMessage.js

에러 메시지가 저장되는 class입니다.

상황에 맞는 함수를 만들어 alert 메시지가 띄어지고 text박스의 값을 비웁니다.

그리고 result자리에 제가 가지고 있는 이미지 파일을 띄워줬습니다.

 

alert메시지띄우기

result자리에 이미지 파일 올리기

---

4. index.js

import로 모듈을 가져온 후 먼저 숫자가 아닌 경우를 확인한 후 그에 맞는 에러 메시지를 띄울 수 있게 하였습니다.

그리고 차례로 숫자가 3개가 아닌 경우 또 중복인 경우를 판단한 후 에러 메시지를 띄울 수 있게 합니다.

 

그리고 return값으로 설정하여 에러메시지가 된다면 빠져나올 수 있게 설정하였습니다.

 

---

5. 마치면서

 

코딩을 하면서 결과를 만들 순 있지만 다른 사람들이 봤을 때 한눈에 이해가 될 수 있도록 만들기는 훨신 어렵다는 것을 느꼈습니다. 물론 지금 이 코딩도 완벽하지 않다는 것을 알고 있기 때문에 이렇게 기능별로 나누는 연습을 좀 더 해야 되야 겠다는 것을 느꼈습니다. 이걸 보면서 만들어보시려는 분은 더 좋은 방법이 있다면 댓글로 알려주시면 감사하겠습니다🙇‍♂️🙇‍♂️

 

 

 

실행 동영상

 

 

 

숫자야구게임 움직이는 배경 참조

 

www.youtube.com/watch?v=-FvAuzjSrAs