Hangman (7) - play Again

이 포스트는 Udemy에 올라온

Brad Traversy의 20 Web Projects With Vanila JavaScript 강의를 보고 정리하는 내용입니다!

https://www.udemy.com/course/web-projects-with-vanilla-javascript/

20 Web Projects With Vanilla JavaScript

 

 

playAgainBtn.addEventListener("click", () => {
  //  Empty arrays
  correctLetters.splice(0);
  wrongLetters.splice(0);

  selectedWord = words[Math.floor(Math.random() * words.length)];

  displayWord();

  updateWrongLettersEl();

  popup.style.display = "none";
});

 

 

팝업창에 있는 playAgain 버튼을 click하면

correctLetters Array와 wrongLetters Array가 다 비워진다.

새로운 단어를 랜덤하게 생성하고

단어를 display한 후에

WrongLetters가 뜨는 UI도 다시 업데이트까지 마치면

popup창이 사라지게 만들고

 

다시 게임 시작~~~~

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

---

이번 프로젝트에서는 HTML, CSS에서 svg 사용하는 방법을 배워서 너무 좋았다.

제일 고생한 부분은 역시 javascript 파트였는데

array method에서 정확히 어떻게 ㅋㅋ 정말 어떤 모습!!!!으로 array가 return되고

그게 innerHTML에 들어가서 어떤 방식으로 화면에 나타나게 되는지에 대해

조금이라도 이해하게 되서 기쁘다 ㅠㅠ

어제 그거 때문에 머리 터졌던 거 생각하면 ㅎㅎㅎㅎㅎㅎ......

 

어쨋든 뿌듯허다.........

맨날 forEach랑 map 조금 쓰는 걸로 만족했었는데

이제는 다른 method도 써보면서 꾸준히 익혀야겠다!!!!