Number Guesser not letting me make guesses

I am asking about the Number Guesser project. I have written the following code inside the codecademy client and can no longer find any more issues in it. However why I try to click on the webpage to increase, decrease my guess or click make guess. Nothing happens. Any particular reason why this is? This issue isn’t present at the start of the project so I must have coded it in. Thanks

let humanScore = 0;
let computerScore = 0;
let currentRoundNumber = 1;

// Write your code below:

const generateTarget = () => Math.floor(Math.random() * 10)
let target = generateTarget()
let human = 1
let comp = Math.floor(Math.random() * 10)

const compareGuesses = (comp, human, target) => {
  let humDiff = Math.abs(target - human)
  let compDiff = Math.abs(target - comp)
  if (compDiff < humDiff) {
    return false
  } else {
    return true
  }
}

const findWinner = compareGuesses => {
  if (compareGuesses === true) {
    let winner = 'human'
  } else {
    let winner = 'computer'
  }
}

const updateScore = winner => {
  switch (winner) {
    case 'human':
    humanScore++
    break
    case 'computer':
    computerScore++
    break
  }
}

const advanceRound = () => {
  currentRoundNumber += 1
}

Please start by posting a link to the exercise, and your raw code (not a codebyte).

Apologies, I have edited the post

We’ll still need that link so we can see how well your script plays with the game.js script. Hopefully you have not modified that script in any way. Also, please post the form part of the HTML.

link to the project
https://www.codecademy.com/paths/full-stack-engineer-career-path/tracks/fscp-javascript-syntax-part-i/modules/fecp-challenge-project-number-guesser/projects/number-guesser-independent-practice

What do you mean by form part of the html? I have been doing the project on the codecademy website

The exercise comes with an HTML file, index.html that is where we get the interface layout from. The right (human) pane looks like this,

        <div class="guess human-guess">
          <div class="guess-title">
            <p class="guess-label">You</p>
            <p class="score-label">Score: <span id="human-score">0</span></p>
          </div>
          <input type="number" id="human-guess" min=0 max=9 value="0">
          <div class="number-controls">
            <button class="number-control left" id="subtract" disabled>-</button>
            <button class="number-control right" id="add">+</button>
          </div>
          <button class="button" id="guess">Make a Guess</button>
        </div>
      </div>

There is no form, proper, but there are form controls, the input and the three buttons.

number_guesser_human_pane

The red dots indicate buttons of the input control that are built in to number type. Let’s first confirm that these buttons are working as expected.

Those marked in blue are button elements in the HTML that work with our script. We’ll get to checking these next.

I have not learnt any html, I am currently only learning javascript and I haven’t edited any html. I had assumed the problem would be in my code block? If you could just point me towards the function I have written poorly i would appreciate it

Where is that function written in the instructions?

Aside

If I were you one would put the JS to the side for a time while you embark on HTML, and CSS. JavaScript is the script language meant to work with those. This is one example, and it only gets more complicated, and harder if you don’t have any HTML practice.

I kept getting thrown errors when trying to call the compareGuesses() function so I threw that in and the errors stopped. You think this is whats bugging the game?

I appreciate the advice on learning html, i’ll take a look tomorrow

I took another stab at it but failed again. I think i am having trouble understanding why we want to return true or false in the compareGuesses() function. Would it not be easier to have playerscore++ instead of returning true and then creating a whole new function?

I dont understand how I am meant to use a parameter equivalent to a string when all I can call upon to decide the winner is a boolean, thats why I made the findWinner function in the first place. Please help me pinpoint my misconception


let humanScore = 0;

let computerScore = 0;

let currentRoundNumber = 1;

// Write your code below:

const generateTarget = () => Math.floor(Math.random() * 10)

let target = generateTarget()

let human = 1

let comp = Math.floor(Math.random() * 10)

const compareGuesses = (comp, human, target) => {

  let humDiff = Math.abs(target - human)

  let compDiff = Math.abs(target - comp)

  if (compDiff < humDiff) {

    return false

  } else {

    return true

  }

}

const updateScore = winner => {

  let winner = compareGuesses

  if (winner === true) {

    humanScore += 1

  } else if (winner === false) {

    computerScore += 1

  }

}

const advanceRound = () => {

  currentRoundNumber += 1

}

^Reattempted without the findWinner function

Because so much code is already written, it’s crucial that we follow all the steps exactly. The why’s and wherefore’s are secondary, and something to come back to once you’ve upped your game in language and UX skills. Check each of your functions against the instructions and be sure they exactly match the specifications.