Números e Math em JavaScript
Em JavaScript, existe apenas um tipo numérico: Number. Seja inteiro ou decimal, tudo é Number. Isso é diferente de linguagens como Java ou C que distinguem entre int, float, e assim por diante. Mais simples, sim — mas vem com algumas armadilhas.
Tipo Number
Em JavaScript, tanto inteiros quanto números de ponto flutuante são do tipo Number — não existe um tipo inteiro separado.
<script>
let a = 42; // Isso é um Number
let b = 3.14; // Isso também é um Number
typeof a; // "number"
typeof b; // "number"
</script>
Números também podem ser escritos em vários outros formatos:
<script>
let hex = 0xFF; // Hexadecimal, igual a 255
let octal = 0o10; // Octal, igual a 8
let binary = 0b1010; // Binário, igual a 10
let big = 1e6; // Notação científica, igual a 1000000
</script>
NaN e Infinity
NaN significa "Not a Number" (Não é um Número), mas é do tipo Number — uma das escolhas de design mais irônicas do JavaScript.
<script>
typeof NaN; // "number" ← Isso mesmo, é realmente um número
NaN === NaN; // false ← Não é nem igual a si mesmo!
Number.isNaN(NaN); // true ← Use este método para verificar NaN
</script>
Quando NaN aparece? Quando você tenta fazer matemática com algo que não é um número:
<script>
parseInt('abc'); // NaN
'olá' * 5; // NaN
Math.sqrt(-1); // NaN
</script>
Infinity representa infinito positivo e aparece ao dividir por zero:
<script>
1 / 0; // Infinity
-1 / 0; // -Infinity
typeof Infinity; // "number"
</script>
=== — use Number.isNaN(). Como NaN === NaN é false, esta é uma armadilha que pegou incontáveis desenvolvedores.
Precisão de Ponto Flutuante
Esta é a peculiaridade mais famosa do JavaScript: 0.1 + 0.2 !== 0.3.
<script>
0.1 + 0.2; // 0.30000000000000004
0.1 + 0.2 === 0.3; // false
</script>
O motivo está relacionado a como os computadores armazenam números de ponto flutuante em binário. O valor 0.1 é uma fração repetitiva em binário, levando à perda de precisão durante o armazenamento. Isso não é exclusivo do JavaScript — todas as linguagens que usam o padrão IEEE 754 têm esse problema.
A solução: use toFixed() para formatação, ou aumente a escala antes de calcular:
<script>
(0.1 + 0.2).toFixed(2); // "0.30"
(0.1 * 100 + 0.2 * 100) / 100; // 0.3
</script>
Exemplo: Demonstração de Problemas de Precisão
<!DOCTYPE html>
<html lang="pt-br">
<body>
<h2>Problemas de Precisão de Ponto Flutuante</h2>
<p id="output"></p>
<script>
let html = '';
html += '0.1 + 0.2 = ' + (0.1 + 0.2) + '<br>';
html += '0.1 + 0.2 === 0.3 ? ' + (0.1 + 0.2 === 0.3) + '<br><br>';
html += '<strong>Solução 1: toFixed</strong><br>';
html += '(0.1 + 0.2).toFixed(2) = ' + (0.1 + 0.2).toFixed(2) + '<br><br>';
html += '<strong>Solução 2: Aumentar escala e depois diminuir</strong><br>';
html += '(0.1*100 + 0.2*100)/100 = ' + ((0.1 * 100 + 0.2 * 100) / 100) + '<br><br>';
html += '<strong>Relacionado a NaN:</strong><br>';
html += 'parseInt("abc") = ' + parseInt('abc') + '<br>';
html += 'NaN === NaN ? ' + (NaN === NaN) + '<br>';
html += 'Number.isNaN(NaN) ? ' + Number.isNaN(NaN) + '<br><br>';
html += '<strong>Relacionado a Infinity:</strong><br>';
html += '1 / 0 = ' + (1 / 0) + '<br>';
html += 'typeof Infinity = ' + typeof Infinity;
document.getElementById('output').innerHTML = html;
</script>
</body>
</html>
O Objeto Math
Math é a utilidade matemática embutida do JavaScript. Sem necessidade de instanciação — basta chamar seus métodos diretamente:
| Método/Propriedade | Propósito | Exemplo |
|---|---|---|
Math.round() |
Arredondar para o inteiro mais próximo | Math.round(4.6) → 5 |
Math.floor() |
Arredondar para baixo | Math.floor(4.9) → 4 |
Math.ceil() |
Arredondar para cima | Math.ceil(4.1) → 5 |
Math.random() |
Número aleatório 0–1 | Math.random() → 0.3721... |
Math.max() |
Valor máximo | Math.max(1,5,3) → 5 |
Math.min() |
Valor mínimo | Math.min(1,5,3) → 1 |
Math.PI |
Pi | 3.141592653589793 |
Math.abs() |
Valor absoluto | Math.abs(-7) → 7 |
Math.pow() |
Exponenciação | Math.pow(2,3) → 8 |
Math.sqrt() |
Raiz quadrada | Math.sqrt(16) → 4 |
Exemplo: Métodos Comuns do Math
<!DOCTYPE html>
<html lang="pt-br">
<body>
<h2>Métodos do Objeto Math</h2>
<p id="output"></p>
<script>
let html = '';
html += 'Math.round(4.6) = ' + Math.round(4.6) + '<br>';
html += 'Math.round(4.4) = ' + Math.round(4.4) + '<br>';
html += 'Math.floor(4.9) = ' + Math.floor(4.9) + '<br>';
html += 'Math.ceil(4.1) = ' + Math.ceil(4.1) + '<br>';
html += 'Math.abs(-7) = ' + Math.abs(-7) + '<br>';
html += 'Math.pow(2, 10) = ' + Math.pow(2, 10) + '<br>';
html += 'Math.sqrt(144) = ' + Math.sqrt(144) + '<br>';
html += 'Math.max(1, 5, 3) = ' + Math.max(1, 5, 3) + '<br>';
html += 'Math.min(1, 5, 3) = ' + Math.min(1, 5, 3) + '<br>';
html += 'Math.PI = ' + Math.PI + '<br>';
let radius = 5;
let area = Math.PI * Math.pow(radius, 2);
html += `Área do círculo com raio ${radius} = ${area.toFixed(2)}`;
document.getElementById('output').innerHTML = html;
</script>
</body>
</html>
Math.round(-1.5) retorna -1, não -2. O comportamento de arredondamento no limite negativo pode não corresponder à sua intenção — tenha isso em mente.
toFixed() — Formatando Decimais
toFixed(n) formata um número para n casas decimais e retorna uma string:
<script>
let price = 9.9;
price.toFixed(2); // "9.90" ← Nota: retorna uma string
+(9.9).toFixed(2); // 9.9 ← Use + para converter de volta para número
</script>
toFixed retorna uma string! Se você precisa fazer mais cálculos com ele, lembre-se de converter de volta para número.
toString() — Conversão de Base
O método de número toString(radix) converte um número para uma string na base especificada:
<script>
(255).toString(16); // "ff" hexadecimal
(255).toString(2); // "11111111" binário
(255).toString(8); // "377" octal
(100).toString(); // "100" decimal (padrão)
</script>
Exemplo: Conversão de Base
<!DOCTYPE html>
<html lang="pt-br">
<body>
<h2>Conversão de Base</h2>
<p id="output"></p>
<script>
let num = 255;
let html = `Número ${num} em diferentes bases:<br><br>`;
html += `Decimal: ${num.toString()}<br>`;
html += `Binário: ${num.toString(2)}<br>`;
html += `Octal: ${num.toString(8)}<br>`;
html += `Hexadecimal: ${num.toString(16)}<br><br>`;
let price = 19.9;
html += `Preço formatado: R$${price.toFixed(2)}<br>`;
html += `Tipo de retorno do toFixed: ${typeof price.toFixed(2)}<br>`;
document.getElementById('output').innerHTML = html;
</script>
</body>
</html>
Math.random() — Gerando Números Aleatórios
Math.random() retorna um número de ponto flutuante aleatório entre 0 (inclusivo) e 1 (exclusivo). Na prática, você frequentemente precisa de um número inteiro aleatório dentro de um intervalo específico:
<script>
// Gerar um inteiro aleatório entre min e max (inclusivo)
function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
</script>
Exemplo: Demonstração de Números Aleatórios
<!DOCTYPE html>
<html lang="pt-br">
<body>
<h2>Gerador de Números Aleatórios</h2>
<button onclick="rollDice()">Rolar Dado</button>
<button onclick="pickLotto()">Escolher Números (1-35)</button>
<p id="output"></p>
<script>
function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
function rollDice() {
let dice = getRandomInt(1, 6);
let dots = '';
for (let i = 0; i < dice; i++) {
dots += ' ⚀';
}
document.getElementById('output').innerHTML =
`Você tirou <strong>${dice}</strong>${dots}`;
}
function pickLotto() {
let numbers = [];
while (numbers.length < 5) {
let n = getRandomInt(1, 35);
if (!numbers.includes(n)) {
numbers.push(n);
}
}
numbers.sort((a, b) => a - b);
document.getElementById('output').innerHTML =
`Seus números da sorte: <strong>${numbers.join(' ')}</strong>`;
}
</script>
</body>
</html>
Math.random() produz números pseudo-aleatórios e não é adequado para fins criptográficos. Para aleatoriedade criptograficamente segura, use crypto.getRandomValues().
📖 Resumo
- JavaScript tem apenas um tipo
Number— tanto inteiros quanto decimais são Number NaNnão é igual a nenhum valor (incluindo si mesmo); useNumber.isNaN()para detectá-lo0.1 + 0.2 !== 0.3é um problema de precisão; corrija comtoFixed()ou aumentando e diminuindo a escalaMath.floorarredonda para baixo,Math.ceilpara cima,Math.roundpara o inteiro mais próximo- Fórmula para inteiro aleatório:
Math.floor(Math.random() * (max - min + 1)) + min toFixed()retorna uma string — converta de volta para número se precisar fazer mais cálculos
❓ Perguntas Frequentes
P：Quanto são
Math.round(2.5)eMath.round(-2.5)respectivamente? R：Math.round(2.5)é3, eMath.round(-2.5)é-2. Quando o decimal é exatamente .5, JavaScript arredonda em direção ao infinito positivo — então tanto números positivos quanto negativos arredondam para cima (mais próximos de 0).
P：Como verifico se um valor é um número válido e finito? R：Use
Number.isFinite(valor). Ele excluiNaN,Infinitye-Infinity, e também rejeita tipos não numéricos. OisFinite()global também funciona, mas não verifica o tipo (faz coerção primeiro).
P：Qual a diferença entre
parseInteNumber()? R：parseInt('12abc')retorna12— ele analisa da esquerda para a direita até não poder continuar.Number('12abc')retornaNaN— a string inteira deve ser um número válido. UseparseIntpara análise tolerante eNumber()para conversão estrita.
📝 Atividades
- Escreva um programa que recebe o raio de um círculo como entrada, calcula sua área e circunferência, e exibe os resultados arredondados para 2 casas decimais.
- Escreva um jogo de adivinhação de números: o programa gera aleatoriamente um inteiro entre 1 e 100, o usuário insere palpites, e o programa responde com "Muito alto" ou "Muito baixo" até encontrar a resposta correta.
- Escreva um conversor de base: insira um número decimal e exiba simultaneamente seus equivalentes binário, octal e hexadecimal.