-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[2주차] 후아유 #3
base: main
Are you sure you want to change the base?
[2주차] 후아유 #3
Conversation
오늘도 할할놀놀을 몸소 실천 중인 웹파트원 ! 화이팅 :) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
코드가 깔끔해서 보기 좋네요! 다음과제도 기대할게요 👍 💯
}, | ||
]; | ||
|
||
const shuffleOrder = () => orderIndex.sort(() => Math.random() - 0.5); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
퀴즈 순서 랜덤을 위해 shuffleOrder함수를 사용했군요 👍 👍
|
||
const setNextStep = () => { | ||
currentStep++; | ||
imageBoard.setAttribute('src', quizList[orderIndex[currentStep]].src); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
저는 image element에 직접 src를 지정했는데, 이런식으로 setAttribute함수를 사용할수도 있군요! 배워갑니다!
if (name === quizList[orderIndex[currentStep]].answer) { | ||
if (currentStep < 4) setNextStep(); | ||
else { | ||
answerListUl.removeEventListener('click', onClickAnswerList); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
등록된 이벤트 리스너를 제거하는걸 생각을 못했는데 참고할게여! 👍
const restartButton = document.querySelector('.buttonList__shuffle'); | ||
|
||
let orderIndex = [0, 1, 2, 3, 4]; | ||
let currentStep = -1; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
setNextStep에서 currentStep++ 을 해줘서 -1로 초기화 시켜준건가용?
✨ 구현 기능 명세
[기본 과제] written by 웹파짱
ul.answer__list > li
에 있는 다섯 가지 이름을 클릭했을 때의 동작을 정의해야해요.imageBoard
에 있는 사진의 주인공이 같은 지 비교해요.틀렸습니다!
모달을 띄워줘요.scoreBoard__score
의 점수를 1점 증가시켜요.imageBoard > image
의 이미지 소스를 변경해줘요.다시하기
버튼을 누르면 게임을 초기화 시켜주세요.[별거 아닌 추가 구현 사항]
🎁 PR Point
일단,, 이번 주차 과제는 벼락치기로 했기 때문에 구현에만 집중해서 리팩토링 할 부분이 많을 것입니다 ,,
마구마구 의견 남겨주시면 감사하겠습니다 ㅎ ㅡ ㅎ (물론 저도 다시 찬찬히 보면서 리팩토링 하려고 하고 있습니다 ㅎ)
제안하고 싶은 구현 방식이나 네이밍, 궁금한 점 등등 자유롭게 남겨주세요 !
$ 함수 안 쓴 이유 - 벼락치기로 하는데 $ 쓰면 addEvent~ 자동 완성이 안돼서요 . . 이래서 타스 써야 합니다 그쳐
리팩토링 하면서 바꿔놓을게요!
저는 바닐라 자스 할 때 여태껏 html 엘리먼트 받아온 변수들을 그 파일의 가장 상단에 선언 및 할당해놓고 썼었어요 (별 이유 없는 습관이에요)
그런데 이번에 굳이 고럴 필요가 없다고 첨 생각하게 됐습니다
고민할 시간이 부족해서 일단 예전처럼 가장 상단에 다 선언해놨는데 리팩토링 하면서 적절한 위치를 찾아보겠습니다!
😭 어려웠던 점
딱히 없었습니다!
😎 구현 결과물
2022-04-23.12.05.24.mov