Formatar moeda brasileira em JavaScript (float para Real)

Neste artigo você vai aprender como formatar moeda brasileira em JavaScript, ou seja, converter um número com ponto flutuante para a moeda Real.

Formatar moeda brasileira em JavaScript capa

Fala programador(a), beleza? Bora aprender sobre conversão de moeda em JavaScript!

Essa função é muto simples com JavaScript, temos um método chamado toLocaleString que atua em números

Fazendo a conversão do mesmo para uma moeda, por exemplo, e podemos escolher o tipo dela

Então vamos determinar que queremos receber o número em pt-br e também que o tipo de moeda é BRL (Real)

Veja um exemplo prático:

Formação Claude Code
Formação Recomendada

Formação Claude Code

Domine Claude Code do absoluto zero até o avançado

  • 120 aulas
  • 4 projetos
  • 9h 45min
var numero = 125.45;

//com R$
var dinheiro = numero.toLocaleString('pt-br',{style: 'currency', currency: 'BRL'});

console.log(dinheiro);

Aqui receberemos a string R$ 124,45

Note que o número é convertido para um dado de texto, pois ele deixa de ser um número por causa da conversão para moeda

Então é interessante utilizar este método apenas quando precisamos exibir para um usuário um determinado número, já na sua forma final

E não quando temos que realizar outra operação com a moeda, aí a ideia é utilizar o valor em ponto flutuante do JavaScript mesmo, entendeu? 😀

Conclusão

Neste artigo vimos como formatar moeda brasileira em JavaScript

Ou seja, converter um número, que pode ser um float, na moeda Real, a que é utilizada em nosso país

Utilizamos para isso o método toLocaleString que é aplicado em dados do tipo number

Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube

Além do toLocaleString existe uma outra forma de fazer isso, usando o objeto Intl.NumberFormat

A vantagem é que tu cria o formatador uma vez e reaproveita ele em vários números, fica mais limpo quando precisa formatar muita coisa

Veja na prática:

const formatador = new Intl.NumberFormat(‘pt-BR’, { style: ‘currency’, currency: ‘BRL’ });

console.log(formatador.format(125.45)); // R$ 125,45

O resultado é o mesmo do toLocaleString, a escolha fica por conta do teu gosto e do cenário

Lembra que o valor formatado vira texto?

Aqui a ideia é limpar o símbolo, tirar o ponto de milhar e trocar a vírgula do decimal por ponto

Se liga:

const numero = Number( texto.replace(‘R$’, ”).trim().replace(/\./g, ”).replace(‘,’, ‘.’) );

console.log(numero); // 1250.45

Agora tu tem um number de novo e pode somar, multiplicar e o que mais precisar

Nem sempre tu quer o R$ na frente, as vezes só precisa do número com duas casas e a vírgula certinha do padrão brasileiro

Pra isso é só formatar sem o style de currency:

const numero = 125.45;

const valor = numero.toLocaleString(‘pt-BR’, { minimumFractionDigits: 2, maximumFractionDigits: 2 });

console.log(valor); // 125,45

Assim tu controla as casas decimais e mantém o formato brasileiro, sem o símbolo da moeda

Perguntas frequentes:

Por que o valor vira texto depois de formatar? Porque o toLocaleString devolve uma string já pronta pra exibição, com símbolo e vírgula. Ele deixa de ser number, então use só na hora de mostrar pro usuário, nunca pra fazer conta

Qual a diferença entre toLocaleString e Intl.NumberFormat? Os dois chegam no mesmo resultado. O Intl.NumberFormat cria um formatador reutilizável, bom quando tu vai formatar vários valores; o toLocaleString é mais direto pra um número só

Como fazer conta com um valor que já está formatado? Primeiro converte a string de volta pra número, limpando o R$ e trocando a vírgula por ponto, aí sim faz a operação

Leia também

Escrito por | Matheus Battisti

Matheus Battisti
Fundador da Hora de Codar

Programador apaixonado pelo mundo das tecnologias, sempre buscando em aprender e se aprofundar em linguagens, frameworks e o que mais for necessário para executar um bom trabalho. Agora tem uma nova missão que é de passar seu conhecimento adiante para formar novos programadores e especializar mais os que já são.

Subscribe
Notify of
guest

7 Comentários
Oldest
Newest Most Voted
Rapha

otima dica! valeu!

Battisti

de nada Rapha!

Liliana Costa

Isso me ajudou muito! Estou criando uma espécie de calculadora de valores e este pequeno método sem dúvidas resolveu o meu problema 😀 Muito obrigada por ter compartilhado a dica

Battisti

de nada Liliana =))

Guilherme Carvalho

Battisti, você teria algum exemplo de como calcular linhas de uma tabela e abaixo um input totalizando o resultado das linhas utilizando a função toLocaleString?

Cesar Devesa

Bacana, e se caso o valor inicial seja uma string, vindo de outra linguagem, de um form por exemplo, é bom usar o parseFloat() antes do toLocaleString()

var numero = "125.45";

var dinheiro = parseFloat(numero).toLocaleString('pt-br',{style: 'currency', currency: 'BRL'});

console.log(dinheiro);
Marcos

Uma dúvida é: como eu faria isso se o meu número está representado em inteiro exemplo: 155096 (preciso exibir como: R$ 1.550,96)

Formações

Formação Vibe Coding

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

  • 474 aulas
  • 20 projetos
  • 39h 27min

Blog | Mais populares