4

Estou tentando setar o valor mínimo e o máximo, utilizando Math.random() * (max - min) + min;, por exemplo, informando na página HTMl o mínimo = 10 e o máximo = 20, mas os resultados são sempre entre 0 e 9 somente, ou seja, não está obedecendo o parâmetro informado.

Se eu definir os números no código, como por exemplo: 5 + (Math.random() * 15);, os resultados são de 5 a 19, o que faz sentido, se considerar que seriam sorteados 15 números, começando do 5.

Mas preciso informar o valor mínimo e o valor máximo que deverão ser sorteados.

Tentei também usar min + (Math.random() * max);, ainda informando na página html o mínimo = 10 e o máximo = 20, os resultados são números começando com 10 e alternado os dois últimos dígitos de 0 a 19.. por exemplo, 1019,106,1015,103... e assim por diante, ainda não respeitando o parâmetro definido.

Alguém pode me ajudar? Onde estou errando?

Segue o código:

function sortear(){
    var min = document.getElementById("minimo").value;
    var max = document.getElementById("maximo").value;
    
    var sorteio = Math.floor(Math.random() * (max - min) + min);
    
    document.getElementById("resultado").innerHTML = sorteio;
}
<div>
  <p>
    Insira o valor mínimo:
    <input type="number" name="minimo" id="minimo">
  </p>
</div>
<div>
  <p>
    Insira o valor máximo:
    <input type="number" name="maximo" id="maximo">
  </p>
</div>
<div>
  <button onclick="sortear()">Sortear</button>
</div>
<div>
  <h1 id="resultado"></h1>
</div>

1 Resposta 1

4

Isso está acontecendo porque você não está passando valores numéricos, mas sim strings que, em alguns casos (dado o comportamento coercitivo do JavaScript) serão convertidos, mas em outros, não.

Desse modo, como a propriedade value sempre retorna uma string, você deve, antes de utilizá-los, convertê-los para o tipo adequado:

function sortear(){
    var min = parseInt(document.getElementById("minimo").value, 10);
    var max = parseInt(document.getElementById("maximo").value, 10);
    
    var sorteio = Math.floor(Math.random() * (max - min) + min);
    
    document.getElementById("resultado").innerHTML = sorteio;
}
<div>
  <p>Insira o valor mínimo: <input type="number" name="minimo" id="minimo"></p>
</div>
<div>
  <p>Insira o valor máximo: <input type="number" name="maximo" id="maximo"></p>
</div>
<div>
  <button onclick="sortear()">Sortear</button>
</div>
<div>
  <h1 id="resultado"></h1>
</div>

No caso, utilizamos o parseInt para realizar a conversão de string para number. Outras opções para essa conversão são o construtor Number ou parseFloat. Você também pode utilizar o operador unário +, mas eu pessoalmente não gosto dessa última opção.

Agora explicarei de fato o que estava acontecendo quando você utilizava os tipos incorretos. Primeiramente, precisamos analisar a expressão a ser interpretada pelo JavaScript:

Math.floor(Math.random() * (max - min) + min);

Supondo que max seja "15" e min seja "5" (note que ambos são strings), podemos assumir o seguinte:

Math.floor(Math.random() * ("15" - "5") + "5");

Primeiro, o JavaScript avaliará a subtração dentro dos parênteses, que dão preferência para essa avaliação. Como o operador -, no JavaScript, significa exclusivamente a subtração aritmética, os dois operandos são corretamente convertidos para o tipo number antes do operador realizar a subtração.

Uma vez que temos o resultado da subtração anterior (10 — note que agora se trata de um número), efetuaremos a multiplicação com o valor retornado por Math.random, que também é um número.

Por fim, o produto será concatenado (+) com o valor de min (que era para ser uma soma). Isso acontece porque, no JavaScript, o operador binário + pode ter significados diferentes dependendo do tipo de seus operandos. Eu explico melhor sobre isso nesta pergunta: Como funciona o operador “+” em JavaScript?.

Então, mantendo os valores max e min como string, teremos a seguinte avaliação passo a passo:

  1. Math.floor(Math.random() * ("15" - "5") + "5");
  2. Math.floor(Math.random() * 10 + "5");
  3. Math.floor(0.8879528248948558 * 10 + "5"); — assumindo que Math.random retorne 0.8879528248948558.
  4. Math.floor(8.879528248948558 + "5");
  5. Math.floor("8.8795282489485585"); — Note que o "5" foi concatenado ao final do produto.
  6. 8Math.floor, de acordo com a especificação, converte o tipo para number automaticamente.

Portanto, como você pode perceber, essa coerção de tipos automática do JavaScript é deveras confusa e cheia de sutilezas que podem afetar a robustez do código. Portanto, é sempre ideal que você converta os tipos explicitamente para o valor numérico se quiser trabalhar com operações matemáticas.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .