Como arredondar e limitar casas decimais no JavaScript: arredondar para cima, para baixo e formatar para 2 casas decimais
4 min4 minutos de leitura
4 min4 minutos de leitura
Durante um projeto, surgiu a necessidade de entender diferentes formas de arredondar e formatar números no JavaScript, como quando precisamos calcular quanto se paga por hora trabalhada.
Autor(a)
Felipe Nascimento
Desenvolvedor e instrutor na Alura com foco em JavaScript.
Inscreva-se em nossa Newsletter
Fique por dentro de conteúdos, insights e oportunidades do universo tech. Receba novidades e lançamentos direto no seu e-mail.
Para isso, criamos uma função que recebe o salário mensal e calcula o valor por hora:
/* Exemplo de como arredondar e limitar casas decimais em JavaScript */functionganhoPorHora(salario, horasTrabalhadasNoMes) {
const salarioHora = (salario / horasTrabalhadasNoMes);
return salarioHora;
}
Resultado da função:
ganhoPorHora(3000,176);
O valor por hora do salário seria: `17.045454545454547`. No entanto, valores financeiros normalmente são apresentados com apenas duas casas decimais. Assim, é necessário arredondar esse resultado.
No JavaScript, para arredondar números, já existe um método do objeto `Math` que arredonda os números para o inteiro mais próximo: o Math.round().
Ele é amplamente utilizado para arredondar valores para o inteiro mais próximo. Este método é muito útil quando você precisa fazer arredondamento javascript básico.
Como usar Math.round() para arredondar números no JavaScript
Resultado da função, agora utilizando `Math.round()`
ganhoPorHora(3000,176);
O valor obtido é 17, eliminando as casas decimais, mas perdendo a precisão necessária para valores monetários.
Isso ocorre porque o método `Math.round()` retorna o valor de um número arredondado para o inteiro mais próximo.
Como limitar casas decimais em JavaScript com o método toFixed()
Como lidamos com valores financeiros, é importante considerar os centavos. Com o método .toFixed(), é possível controlar a quantidade de casas decimais após a vírgula, bastando informar esse número como parâmetro.
Para obter duas casas decimais, usamos toFixed(2). Um detalhe importante: o método .toFixed() arredonda o número, por exemplo, 11.123 vira 11.12 e 20.555 vira 20.56. Vale ressaltar também que seu retorno é uma string que representa o número formatado.
Agora que conseguimos exibir o resultado com duas casas decimais, podemos aprimorar ainda mais, formatando na moeda local (Real).
Como formatar moeda no JavaScript com toLocaleString()
No JavaScript temos um método chamado toLocaleString() que converte um número para uma string formatada de acordo com as convenções locais (incluindo separadores de milhar, símbolo da moeda e casas decimais), tornando a tarefa do programador muito mais simples.
Este método utiliza a API de Internacionalização (Intl) internamente.
O método toLocaleString() recebe como argumento um objeto literal de configurações. Veja os principais parâmetros:
• `style` : Que é o estilo do formato a ser utilizado, aqui é permitido usar:
`decimal` para representar números simples.
`currency` que diz respeito ao formato monetário e que vai indicar a moeda que vai ser utilizada.
`percent` para formato percentual.
• `currency`: A moeda para usar na formatação monetária
Utilizando a formatação com `toLocaleString`, o resultado fica assim:
ganhoPorHora(3000,176); //'R$ 17,05'
Para saber mais sobre o assunto
No JavaScript, há outros métodos que podem ser utilizados para arredondar números:
Math.ceil(): retorna o menor inteiro maior ou igual ao número fornecido. Exemplo: `Math.ceil(11.123)`, resultado `12`.
Math.floor(): retorna o maior inteiro menor ou igual ao número fornecido. Exemplo: `Math.floor(11.789)`, resultado `11`.
Intl.NumberFormat: para aplicações que precisam formatar muitos números, considere usar `Intl.NumberFormat`, que oferece melhor performance para operações repetidas.
Se ficou interessado em como o Javascript funciona e como você pode utilizá-lo melhor, aqui na Alura temos uma Trilha Front-end. Nela, você verá como programar em Javascript, utilizar expressões regulares etc.
Além disso, se pretende construir uma carreira na área de front-end, recomendamos que conheça a carreira de Desenvolvimento Front-End React, onde você segue um caminho organizado de evolução profissional, direto ao ponto, desde o básico ao avançado.
