Hosted Project
https://github.com/JS-Beginners/whack-a-mole-projectGitHub Source Files
https://github.com/JS-Beginners/whack-a-mole-projectProject Objective
The objective of this JavaScript Project is to wire up a JavaScript Whack-a-Mole game.JavaScript Used
- JavaScript core (e.g. functions, Math object, DOM API)
My Personalize Summary
Level of Difficulty
This is one of those projects that I again had to simply settle with the code along. Therefore, I wouldn't exactly call this a beginner's JavaScript project. While the JavaScript itself is easy to understand, it would take me many hours to implement before I got such a game to run correctly. In other words, I found the code easy to read, understand, and follow but the project hard in practice to implement. The program only has 5 functions though.- A function to create a random amount of time that the mole will peep.
- A function to choose the random hole from which the mole will peep.
- A function to make the mole pop from the random hole using the two above functions.
- A function to start the game.
- A function to “prevent” cheating.
New Things Learned or Refreshed
I learned about the .isTrusted property that lives on the event object. “TheisTrusted
read-only property of the Event interface is a Boolean that is true when the event was generated by a user action, and false when the event was created or modified by a script or dispatched via EventTarget.dispatchEvent()
.”
Time to Code
Since I simply followed along on this project, it took me about two hours to listen, watch, and code out the solution.Lines of Code
This project uses around 50 lines of JavaScript code, including white space and code comments.Your Turn!
What to Accomplish
- Download the source code from the github repository above.
- Delete the JS content in the
script.js
file. - Implement the JavaScript code in your own
script.js
file. - If you think you need to see a video solution first, be sure to pick up Bluelime's beginner JavaScript course by following the link below.
- Share a link to your finished project in the comments section below so we can all see and comment on it!
What You Should See
- Visit the hosted github project to see this Whack-A-Mole JavaScript game in action.
Need to see the video solution for this project?
Get Bluelime's 27 Beginner JavaScript Projects course now!
Leave a Reply