Fim de jogo | JavaScript: validações e reconhecimento de voz

function verificaValorValido(chute) { const numero = +chute fimDeJogo(numero) numeroForInvalido(numero) checarNumeroLimites(numero) testaChute(numero) } function fimDeJogo(chute) { if (chute.toLowerCase == 'final'){ document.body.innerHTML =` <h1>Game Over</h1> <h3>O número secreto era ${numeroAleatorio} `} } function numeroForInvalido(numero) { if (Number.isNaN(numero)) { elementoChute.innerHTML += ` <div class="retorno">Valor inválido</div> ` } } function checarNumeroLimites(numero) { if (numero > maiorValor || numero < menorValor) { elementoChute.innerHTML += ` <div class="retorno">Seu chute está fora dos limites. Número secreto está entre ${menorValor} e ${maiorValor}</div> ` } } function testaChute(chute) { if (chute < numeroAleatorio) { elementoChute.innerHTML += `<div class="retorno">O número secreto é maior <i class="fa-sharp fa-solid fa-arrow-up"></i></div>` } else if (chute > numeroAleatorio) { elementoChute.innerHTML += `<div class="retorno">O número secreto é menor <i class="fa-solid fa-arrow-down"></i></div>` } else if (chute == numeroAleatorio) { document.body.innerHTML = ` <h2>Você acertou!</h2> <h3>O número secreto era ${numeroAleatorio}</h3> <button id="jogar-novamente" class="botao-jogar">Jogar novamente</button> ` } } document.body.addEventListener('click', e => { if(e.target.id=='jogar-novamente') { window.location.reload() } })

Oi Anna, tudo bem?

Segue uma possível solução para sua proposta.

function verificaSeOChutePossuiUmValorValido(chute) {
    const numero = +chute

    if (chuteInvalido(numero)) {

        if (chute == 'final') {
            console.log('aqui')
            document.body.innerHTML = 
        `
        <h2>Fim de jogo!</h2>
        <button class="btnJogar" id="jogarNovamente">Jogar novamente?</button>
        `
        } else {
            console.log('ali')
            elementoChute.innerHTML += '<div> Valor inválido </div>'
        }
        return
    } 

    else if (numeroMaiorOuMenorQueOPermitido(numero)) {
        elementoChute.innerHTML += 
        `<div>
            O valor precisa estar entre os números ${menorValor} e ${maiorValor}
        </div>`
        return
    }

    else if (numero === numeroSecreto) {
        document.body.innerHTML = 
        `
        <h2>Você acertou!</h2>
        <h3>O número secreto era ${numeroSecreto}!</h3>
        <button class="btnJogar" id="jogarNovamente">Jogar novamente?</button>
        `
    }

    else if (numero > numeroSecreto) {
        elementoChute.innerHTML += 
        `<div>
            O número secreto é menor
            <i class="fa-solid fa-arrow-down"></i>
        </div>`
    }

    else {
        elementoChute.innerHTML += 
        `<div>
            O número secreto é maior
            <i class="fa-solid fa-arrow-up"></i>
        </div>`
    }
}

function chuteInvalido(numero) {
    return Number.isNaN(numero)
}

function numeroMaiorOuMenorQueOPermitido(numero) {
    return numero > maiorValor || numero < menorValor;
}

document.body.addEventListener('click', e => {
    if (e.target.id == 'jogarNovamente') {
        window.location.reload()
    }
})

Em relação ao código que compartilhou, vou levantar alguns pontos:

function verificaValorValido(chute) {
    const numero = +chute

    fimDeJogo(numero)

Observe que você tem o chute como parâmetro da função do tipo str que é convertido e armazenado na variável numero. Porém, na função fimDeJogo, para realizar de fato a verificação você precisa do chute str e não ele convertido em numero. Vamos receber um NaN sempre como resultado.

function fimDeJogo(chute) {
    if (chute.toLowerCase == 'final'){

Sugestão!

Você pode usar direto o chute, sem converter e realizar um novo teste, como ilustra o código abaixo:

function verificaValorValido(chute) {
    const numero = +chute

    fimDeJogo(chute)

Fez sentido?

Espero ter ajudado e sucesso na sua jornada!

: )