Como formatar float em JavaScript

Neste artigo você vai aprender a como formatar float em JavaScript, utilizando uma simples função da linguagem

Fala programador(a), beleza? Bora aprender mais sobre floats e JavaScript!

Para formatar floats, ou seja, ajustar o número de casas decimais de um número, vamos precisar da função toFixed

Basta colocar como argumento o número de casa que desejamos ter ao final

Como é uma função de números, ela é utilizada em um número mesmo

Veja um exemplo prático:

const x = 12.83333333

console.log(x.toFixed(3)) // 12.833

const y = 1.979

console.log(y.toFixed(1)) // 2

Veja que temos os números em variáveis e utilizamos as funções neles

Formação Recomendada

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

• 474 aulas
• 20 projetos
• 39h 27min

Conhecer formação

Note que há também um arredondamento, em alguns casos isso pode ser um problema

E uma curiosidade interessante é que em JavaScript não temos a diferenciação de floats e integers

Todos os números são considerados do tipo de dado number!

Conclusão

Neste artigo você aprendeu a como formatar float em JavaScript

Basta utilizar a função toFixed, ela aceita um número como argumento, que será o número de casas do elemento após a aplicação da função

Note que há um arredondamento em alguns casos, que pode ser prejudicial ao seu sistema

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias! Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias. O link acima contém um cupom de desconto para os cursos!

Aqui tem uma pegadinha que já ferrou muita gente

O toFixed não devolve um número, ele devolve uma string

Parece detalhe bobo, mas se você tentar fazer conta depois vai tomar um resultado zoado

Veja:

const preco = 19.9

const formatado = preco.toFixed(2) // "19.90" (isso é texto!)

console.log(formatado + 1) // "19.901" e não 20.9

Repara que o + 1 grudou no final em vez de somar, porque o JavaScript entendeu que era uma concatenação de texto

Pra voltar a ser número, é só envolver com Number ou parseFloat

const numero = Number(preco.toFixed(2)) // 19.9 (agora sim, number)

console.log(numero + 1) // 20.9

Então a regra é: usa o toFixed pra EXIBIR o valor formatado na tela, e converte de volta pra number sempre que for fazer conta

Só que o toFixed não coloca o separador de milhar nem a vírgula no padrão brasileiro

Pra isso o JavaScript já tem uma função built-in muito massa, o toLocaleString

const valor = 1234.5

console.log(valor.toLocaleString(‘pt-BR’, { style: ‘currency’, currency: ‘BRL’

Repara que ele já bota o R$, troca o ponto pela vírgula e ainda separa o milhar sozinho

Se você só quer o separador de milhar sem o símbolo da moeda, é só tirar o style e o currency

const n = 1234567.89

console.log(n.toLocaleString(‘pt-BR’)) // 1.234.567,89

Bem mais prático que ficar montando isso na mão, né?

O post já avisa que o toFixed arredonda, e em alguns sistemas isso é um problema de verdade

Às vezes você quer só CORTAR as casas decimais, sem arredondar pra cima

Um jeito simples é multiplicar, cortar a parte decimal com Math.trunc e dividir de volta

function truncar(numero, casas) { const fator = Math.pow(10, casas) return Math.trunc(numero * fator) / fator }

console.log(truncar(1.979, 1)) // 1.9 (cortou, não virou 2)

console.log((1.979).toFixed(1)) // 2 (aqui o toFixed arredondou)

Repara na diferença: o toFixed transformou 1.979 em 2, e a função truncar manteve 1.9

Use o toFixed quando arredondar tá de boa, e a versão com Math.trunc quando você precisa cortar sem mexer no valor pra cima

O toFixed retorna número ou string?

Retorna string, sempre

Se for fazer conta depois, converta com Number ou parseFloat

Como formatar float com 2 casas decimais?

É só passar o 2 como argumento: valor.toFixed(2)

Existe diferença entre float e int no JavaScript?

Não

No JavaScript todo número é do tipo number, não existe essa separação que outras linguagens têm

Como formatar float pra real (R$)?