Find Your Hat Challenge Project (JavaScript)

Wouldn’t be me if I didn’t pick on something trivial…

    let hatPosition = Math.floor(Math.random() * primeArrLength);
    if (hatPosition === startPosition) {
        do {
            hatPosition = Math.floor(Math.random() * primeArrLength);
        } while (hatPosition === startPosition);


  let hatPosition;
  do {
    hatPosition = Math.floor(Math.random() * primeArrLength);
  } while (hatPosition === startPosition);
1 Like

Thank you! I think I’ve put do while inside if several times, working now on correcting it all.

1 Like

Here is my solution:

this my solution[Find tour hat]
Esta fue mi respuesta al proyecto; si pueden verla y analizar algún error en la sintaxis, se los agradecería

This is my solution:

It includes user-configurable grid size, hole chance, and how often to add new holes (“hard mode”).

Field.findOpenSpot() could be optimized by maintaining an array of open spots on the grid and picking from that. The current implementation just picks a random location and loops until it finds one that isn’t occupied. This could potentially take a very long time if the field is mostly full and will infinite loop if the field is completely full, but I want to get on with the next lesson.

P-P-P-Private Prinny reporting! I have an emergency communication from M-M-M-Master Etna, dood!

"Ok, so what in all the netherworlds is going on with this challenge? My Prinny squad have been exceptionally attentive to me recently and it’s creeping me out! They have told me that they would much rather suffer their typical chores than be forced to attempt this challenge!!

They report that while they have been working through the Create Video Games with Phaser.js course that this challenge quest appeared out of nowhere while they were learning what classes were. It uses some sort of application that they have never encountered before, and even after having viewed the solution they say that what relation it even has to these classes is entirely unclear as they are barely used!

I don’t know what MY Prinnies are up to trying to learn this stuff, but this challenge has caused significant defects to them and I demand some sort of explanation as to what this challenge has to do with helping them learn, whatever it is they are learning!

Yours sincerely,

Beauty Queen Etna <3

PS. The only thing I approve of my Prinnies doing regarding this is checking out the answers to the problem."

S-s-s-so, there you have it! Please help us figure out just what we are supposed to be doing here, or Master Etna may adopt this challenge as a new method of punishment!


Hi Private Prinny, thanks for your report!

Please take this message back to your Master Etna:
"This ‘Find Your Hat’ Challenge Project is quite different from the usual fetch side quests that you may have ordered your Prinny squad members to do!

Instead of our usual practice Projects that tell you what code to write and where to write it, this project, a Challenge Project, does not! Instead it gives you the premise with broad/general instructions to guide you through the completion. As you can see, for a Prinny, this might be too big of an ask. It would require someone of at least your stature to take up and finish since it takes much longer to complete and more brain power to get the job done right!

This particular challenge project is also different from the JS/Phaser material because it’ll make use of a bash terminal and node to run your JavaScript code (rather than directly outputting in the terminal for you or have a browser interpret your code). But rest assured it’s still all JavaScript!

I also think that your Prinnies did well in looking over the solutions. These solutions can definitely help if you’re ever in a pinch/stuck, or if you want to improve your ‘code literacy’. If you’re up for the task and you want to practice using JavaScript in more general programming, try taking up this side quest for yourself! Otherwise, it’s not needed to continue on your Phaser main quest."

Hope that helps, safe travels Prinny!

My solution

Hello there! I’m trying to have a look at the solution by running it on my macbook… But I cannot get how to let it run… Can someone help me?

Hi there, I’m new to coding and wanted to try and pick up JS for some time.
I’m about 80% through the curiculum and thought I was doing ok until I got to this ‘find my hat’ project.

I just got lost straight away and now questioning whether I’ve got the ability to really learn this stuff. Have I missed any steps or should I have been reading something else to get to this standard???

How on earth does a developer know where to start with tasks like this?

Hi @kevingraziani,

If you’re trying to run it on your macbook, it sounds like you’re trying to use your local environment (not on to run a JavaScript file (with a .js extension). If that’s the case, you need to set up node: here’s an article on installing Node.

If you rather forgo that and want to work on Codecademy, copy the final solution code and paste it into our code editor and click “Save”.

@majorhang that’s a good and tough question.

At its core, these Challenge Projects are intended to provide less instruction and let you come up with the necessary solutions.

Try to break down the projects into even smaller bits.
Take the second step for example:
— Start of Step 2
Your project is centered on a Field class. This and the following tasks will describe how the class should function at a high level, and it will be up to you to figure out the implementation in code. As you go, test your code by creating instances of the class and calling its methods.

The Field constructor should take a two-dimensional array representing the “field” itself. A field consists of a grid containing “holes” (O) and one “hat” (^). We use a neutral background character () to indicate the rest of the field itself. The player will begin in the upper-left of the field, and the player’s path is represented by *.


Your class should take a single argument representing the field:

const myField = new Field([
  ['*', '░', 'O'],
  ['░', 'O', '░'],
  ['░', '^', '░'],

---- End of Step 2

Now this is a reallly big step. So we can break it down into smaller steps for ourselves :slight_smile:

  1. Let’s start first with the Field class, do you feel comfortable working with a class? If not then review classes for a bit.
  2. Then with classes, we know there are constructors. Look up the syntax to create a constructor, either through a cheatsheet or googling (fwiw, I never remember how to do it, I have to google)
  3. This constructor should accept a 2D array, do a little brush up on arrays.
  4. Add the correct parameters to the constructor
  5. Make up a 2D array and try to create a Field instance. (or copy it from the step :slight_smile: )
  6. Test that the Field instance works correctly, and if it doesn’t debug)

You can break down this step even further to go at your own pace, but that’s just a rough example of how seemingly big problems can be deconstructed to be more manageable smaller problems.

And keep posting and asking questions! It’s all part of learning!

Hope that helps!


Hi, everybody
this is my solution of Find Your Hat Challenge Project
please give me your feedback!!!

My solution including a maze solver using A* Search Algorithm with Manhattan heuristic

My soluiton, i add an extra. The user can select the size of the map. :smiley:

just a quick note: If not setting a random start location for the player.
this can give the hat the starting location of 0,0 which would be the same as the player :wink:
const hatLocation = {
x: Math.floor(Math.random() * fieldW),
y: Math.floor(Math.random() * fieldH)
I chose to use ceil instead so it was always at least at 1,1

Bear in mind that Math.random() can occasionally result in zero. When that happens, Math.ceil() will return 0.

Here’s my finished code! Any feedback is welcome.

ADDED Features:

-Character starts in a random location instead of the upper left
-‘Hard mode’ option where a new hole is added after every move
-color graphics
-field validator to ensure that the generated field is solvable (this had me stumped for hours…eventually I had to peek into someone else’s code to see how this can be done)
-upon game completion, player is asked if they want to play again.

All in all though this took me a LOT longer than 2 hours…

Being that this is my first programming course tackling these projects is still quite the challenge. Instead of bouncing around the internet for hours and hours to answer one question at a time I decided to instead look at the Codecademy solution and analyze it line by line and research anything that I didn’t understand. This process still took hours and hours but I felt it was a more targeted and efficient approach and since my time is limited…it made the most sense to me. I’ve made notes for each block and most lines where I try to explain what that code is doing and why (to the best of my understanding at this point).

If anyone sees this and can offer corrections or better/further clarification you are more than welcome to do so. I’m humble and eager to learn. If I can help someone else do the same in the process than we all win right?