111

Qual a melhor forma de se representar unidades monetárias (i.e. dinheiro) em JavaScript? Sei que não é bom usar ponto flutuante, dado o problema de arredondamento, mas não sei qual seria a melhor alternativa. Outras linguagens têm tipos Decimal como built-ins, mas até onde eu saiba não tem nada padronizado (ou amplamente utilizado) para esse propósito em JavaScript.

Até o momento, tenho usado inteiros para representar centavos, e feito toda formatação/conversão na mão. Há uma maneira melhor, ou mais "limpa"?

Detalhes adicionais: estou buscando uma resposta canônica - haja vista que esse é um requisito comum com o qual muitos de nós precisamos lidar, e que frequentemente é feito de forma incorreta. Uma boa resposta pode tanto ser uma indicação de biblioteca - desde que bem embasada - quanto um guideline para se implementar manualmente (caso a resposta certa seja "depende", i.e. não exista uma forma canônica para isso).

Exemplos de critérios a serem considerados (não exaustivo):

  1. Confiabilidade - essa representação produz resultados corretos em operações matemáticas envolvendo unidades monetárias (ex.: arredondamento correto)? se comporta bem em casos limite?
  2. Interoperabilidade - é simples converter de e para um formato aceito pelo servidor e/ou sistemas externos (em geral, um decimal sem separador de milhar e usando o ponto . para separar a parte inteira da fracionária)?
  3. Robustez - se o usuário entrar com os dados incorretamente (ex.: usando o ponto ou a vírgula de forma incorreta/inconsistente, colocando ou não o cifrão, etc) a conversão para esse formato interpreta a entrada corretamente e/ou falha consistentemente?
  4. Apresentação - é simples formatar esse tipo de dados para ser apresentado ao usuário?
1

7 Respostas 7

72
+50

Todas as respostas acrescentam ótimas informações, mas gostaria de dar uma resposta mais direta.

Representando uma moeda (dinheiro)

A forma mais indicada é usar números inteiros (int ou long). O motivo para evitar números de ponto flutuante são os problemas de representação binária que causam diferenças nos valores mesmo em operações muito simples.

Além do Fowler (citado pelo Leonardo), Bloch também defende o uso de inteiros no livro Effective Java. Outra fonte é esta questão do SOEN.

A ideia aqui é análoga a representar a massa em gramas ao invés de kilogramas. No caso do Real, representamos os valores em centavos ao invés de reais. Então, o valor R$ 10,99 (dez reais e noventa e nova centavos) é representado por 1099 (mil e noventa e nove centavos).

Operações matemáticas e financeiras

As operações de soma, subtração e multiplicação são realizadas diretamente, sem nenhuma dificuldade. Entretanto, se houver operações de divisão, deve-se arredondar adequadamente o resultado final para inteiro novamente.

O arredondamento é um tópico interessante e não podemos ser simplistas. A verdade é que não existe uma regra fixa para arredondar para cima ou para baixo. Quando falamos de dinheiro, não estamos considerando apenas a precisão, mas quem perde e quem ganha.

Um dos exemplos de legislação afetando arredondamentos é o caso do Código de Defesa do Consumidor. O valor cobrado do consumidor deve ser sempre arredondado para baixo.

Outro exemplo usado muito nos meios financeiros é a distribuição de parcelas. Por exemplo, suponha o cálculo das parcelas de um financiamento R$ 100,70 em três vezes sem juros. Em termos de legislação, o cliente não pode pagar mais do que o valor total a ser cobrado. Note que o valor dividido em três partes é igual a 33,5666... e não podemos arredondar para cima (R$ 33,57), caso contrário o cliente pagará o total de R$ 100,71 (um centavo a mais). Uma solução para isso é arredondar a parcela para baixo (R$ 33,56), resultando num total de R$ 100,68, sendo que a empresa assume o prejuízo de 2 centavos.

Porém, muitas instituições financeiras não querem essas diferenças poluindo a contabilidade. Devemos lembrar que cada arredondamento deve ser justificado contabilmente. Em decorrência disso, é comum em sistemas onde trabalhei temos um ajuste na última parcela. Continuando com o exemplo acima, teríamos as parcelas R$ 33,57, R$ 33,57 e R$ 33,56, totalizando exatamente R$ 100,70.

Conversão entre diferentes moedas

A conversão de uma moeda para a outra pode seguir o mesmo conceito das operações matemáticas, apenas ajustando-se a unidade de media básica.

Apresentação para o usuário

Uma das vantagens de usar inteiros é separar a representação interna da apresentação visual.

O número inteiro pode ser facilmente formatado usando qualquer rotina, com a desta resposta do SOEN:

Number.prototype.formatMoney = function(c, d, t){
var n = this, 
    c = isNaN(c = Math.abs(c)) ? 2 : c, 
    d = d == undefined ? "." : d, 
    t = t == undefined ? "," : t, 
    s = n < 0 ? "-" : "", 
    i = parseInt(n = Math.abs(+n || 0).toFixed(c)) + "", 
    j = (j = i.length) > 3 ? j % 3 : 0;
   return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
 };

Note que a função deve ser adaptada para extrair as duas casas decimais do número.

Considerações da solução

Confiabilidade

Os resultados serão sempre corretos e a solução se comporta bem em casos limite, já que não há problemas de arredondamento. Deve-se observar apenas as regras de negócio de como e quando arredondar, conforme mencionado acima.

Interoperabilidade

Este pode ser um ponto complexo para qualquer solução, pois o número formatado num input do HTML pode não ser corretamente interpretado no servidor.

Diferentes tecnologias e frameworks validam e interpretam os dados de forma diferenciada. A questão é que, se os números estiverem formatados no submit, o servidor deve extrair todos os caracteres não numéricos e então converter o valor para um número inteiro.

Se a tecnologia não for um limitante para isso, a interoperabilidade dessa solução é excelente, evitando inclusive confusões com pontos e vírgulas.

Robustez

A robustez com relação à entrada de dados não está relacionada diretamente com a forma de representação.

No entanto, racionar pensando em números inteiros pode ajudar também neste aspecto. Sabe aqueles sistemas (como em caixas eletrônicos), onde você digita o valor completo da direita para a esquerda, sempre especificando a parte decimal ao final? Como nesta questão. É possível fazer a formatação com um plugin, como fiz neste fiddle.

Apresentação

Item já considerado em tópico anterior. Qualquer rotina de formatação funciona, desde que considere que as casas decimais estão representadas na parte inteira do número.

Eficiência

Mesmo quando há um tipo "nativo" na linguagem, como Decimal ou BigDecimal, trabalhar com números inteiros é mais eficiente do ponto de vista computacional por razões óbvias.

8
  • 1
    As outras respostas (em especial a do Leonardo Otto) são muito boas, mas até o momento essa é a mais completa. Pena que, na prática, isso signifique reinventar a roda: não há tipos inteiros em JavaScript (exceto por Int32Array e similares), e todo o resto teria que ser feito à mão (como já venho fazendo, aliás). De qualquer forma, é esse tipo de guideline que eu estava procurando, e se uma das bibliotecas recomendadas satisfizer esses requisitos eu deixarei uma menção aqui.
    – mgibsonbr
    Commented 1/04/2014 às 23:00
  • 1
    @mgibsonbr Eu analisei algumas bibliotecas e a única que parece satisfazer a questão da precisão é a implementação do BigDecimal do Java em Javascript. Não cheguei a testar, mas li em algum lugar que o script fica com uns 300kb! Além disso, a maioria das bibliotecas se preocupa apenas com formatação e conversão entre moedas. É um pouco frustrante.
    – utluiz
    Commented 2/04/2014 às 13:26
  • 1
    @mgibsonbr Por outro lado, em minha experiência não é algo comum implementar cálculos financeiros em Javascript, a não ser contas simples para visualização do usuário, como um totalizador, mas nada que comprometa o valor final. Todas as empresas do segmento financeiro que conheço trabalham com Java ou C# e fazem os cálculos no back end. Não sei o que o pessoal que trabalha com Node.js anda fazendo.
    – utluiz
    Commented 2/04/2014 às 13:34
  • Essa metodologia (do inteiro) pode ser complicada se o seu produto deve atender clientes que usam tanto duas casas decimais como quatro, pior ainda, se o número de casas decimais puder ser configurado pelo usuário. Por exemplo; R$ 10,99 viram 1099 centavos, porém se o seu cliente resolve usar 3 casas decimais (ex.: posto de gasolina) 1099 passam a representar R$ 1,099! Eu utilizo o bigmoneyjs (que utiliza o bigdecimal citado acima), e para formatar utilizo o numeraljs. O bigmoney inclui a função allocate do Fowler, citada nesta resposta. Commented 8/12/2014 às 16:19
  • 1
    @utluiz eu entendi isso, perfeitamente. Estou dizendo que não se aplica no meu projeto por exemplo, onde cada um dos usuários pode configurar o preço com quantas casa decimais quiser. Por exemplo, um posto de gasolina os preços tem três casas, uma empresa de câmbio usa oito casas para algumas operações e menos para outras, e os outros 99% dos usuários usam apenas duas. Eu concordo com a sua resposta e para um contexto onde sempre são utilizadas duas casas acho o mais adequado a se adotar, porém acredito que no meu caso sairia mais complicado lidar com essa complexidade assim. Commented 8/12/2014 às 22:37
41
+50

Antes de analisar seus requisitos vou adicionar algumas definições:

Interoperabilidade

Interoperabilidade é a capacidade de um sistema (informatizado ou não) de se comunicar de forma transparente (ou o mais próximo disso) com outro sistema (semelhante ou não). Para um sistema ser considerado interoperável, é muito importante que ele trabalhe com padrões abertos ou ontologias. Wikipedia

Confiabilidade

Confiabilidade ou fiabilidade (definição sistêmica) é a capacidade de uma pessoa ou sistema de realizar e manter seu funcionamento em circunstâncias de rotina, bem como em circunstâncias hostis e inesperadas. Wiki.

Robustez

É a capacidade de um sistema computacional de lidar com erros durante sua execução ou a capacidade de um algoritmo para continuar a operar apesar das anormalidades das entradas e cálculos. Wiki

Seus requisitos são os seguintes

  1. A confiabilidade, em primeiro lugar - o tipo de dados/forma de cálculo deve produzir resultados corretos

    • Você só vai conseguir confiabilidade na biblioteca ( aka calculos) se você fizer um conjunto de testes extensivos em todo o código da biblioteca. Isso vai provar a confiabilidade.
  2. A interoperabilidade, ao comunicar com o servidor (se aplicável);

    • JSON é um padrão interoperável para comunicação entre Javascript e o servidor. Eu utilizaria extensivamente JSON para comunicação
  3. A interoperabilidade/robustez de formatos

    • Sua API deve suportar múltiplas formas de representação de formato de entrada. Por exemplo "R$ 1.23", "1.23", "1,23","102.123,30" ou falhar consistentemente aceitando só a forma correta do formato e informando o lugar exato do erro. Recomendo aceitar só um formato para não causar confusão. Lembrando o conceito de Ubiquidade como recomendado por Evans em DDD
  4. A apresentação, como mostrar as saídas para o usuário

    • Você tem um dado, e vai ter múltiplas representações. Se tiver um algoritmo padrão coloque dentro do objeto, se tiver múltiplas representações você precisa isolar isso.

Como implementar?

Para os Testes:

  • Um framework de testes [SO em Inglês]

(https://stackoverflow.com/questions/300855/javascript-unit-test-tools-for-tdd/). O framework de testes é uma escolha pessoal. Normalmente uma questão estética em função de sua API. Depois de escolher ele recomendo verificar os testes do framework. Para mim é inaceitável que um framework de testes não utilize a si próprio para testar suas funcionalidades. (Algo como: "Quem surgiu antes: O ovo ou a Galinha?") O accounting me parece ter um bom conjunto de testes.

Para a modelagem:

Como recomendado por Martin Fowler em seu livro Patterns of Enterprise Application Architecture você deve utilizar:

  1. Um tipo inteiro com a quantia (1000 = R$ 10,00)
  2. O tipo da moeda (Reais ou Dólares - Utilize o código da moeda).

Você deve evitar utilizar qualquer tipo de ponto flutuante pois isso poderá causar problemas de arredondamento que é o que você quer evitar. Nos cálculos você deve sempre levar em conta o tipo da moeda.

Patterns of Enterprise Application Architecture

Na maior parte do tempo, as pessoas querem valores monetário arredondados para a menor unidade da moeda, como os centavos no dólar. Entretanto, há vezes em que unidades fracionárias são necessárias.

É importante deixar claro com que tipo de dinheiro você esta trabalhando, especialmente em uma aplicação que usa ambos os tipos. Faz sentido ter diferentes tipos para os dois casos, pois eles se comportam de forma bastante diferente no que diz respeito à aritmética.

O dinheiro é um Objeto Valor, então deve ter suas operações de igualdade e código hash sobrescritas para serem baseadas na moeda corrente e na quantia.

O dinheiro precisa de operações aritméticas, de modo que você possa usar objetos desse tipo tão facilmente quanto usa números. Contudo, operações aritméticas com dinheiro têm algumas diferenças importantes em relação às operações com números.

A mais óbvia, qualquer adição ou subtração precisa ter ciência da moeda, de modo que você precisa reagir se tentar adicionar diferentes tipos de medas. A resposta mais simples, e mais comum, é tratar a adição de moedas incompatíveis com um erro.Em algumas situações mais sofisticadas, você pode usar a ideia de Ward Cunningham de um saco de dinheiro. Esse é um objeto que contém moedas de tipos diferentes juntas em um objeto. Este objeto pode então participar de cálculo como qualquer objeto dinheiro.

A multiplicação e a divisão acabam sendo mais complicadas devido a problemas de arredondamento. Quando você multiplica dinheiro, faça isso com uma grandeza escalar. Se você quiser adicionar uma taxa de 5% a uma conta, multiplique-a por 0,05 de modo que você se preocupe apenas com a multiplicação por tipos numéricos normais.

Existem mais detalhes dentro do livro não posso passar todo o capitulo aqui por questões legais.

Para a representação:

Você tem múltiplas estratégias de representação. Utilize o padrão Strategy para cada uma das estratégias de representação.

Como indicado pelo Sergio você pode utilizar uma lista com as configurações de cada tipo de moeda e utiliza o padrão se surgir alguma necessidade diferente para representação.

E a roda?

Implementar uma biblioteca robusta para tratamento monetário não é algo tão simples, principalmente por causa dos casos especiais. Então temos que procurar as rodas antes de recriar elas. Aqui tem uma lista de bibliotecas Javascript para tratar de dinheiro e moedas. Você precisa analisar se elas atendem seus pontos:

  • Testes extensivos

  • Comunicação fácil com JSON ou um meio fácil de criar um modulo na biblioteca que faça isso.

Um exemplo

Se você achar que as bibliotecas atuais não atendem aos seus requisitos vou deixar uma sugestão de implementação da API no nível do usuário apenas por curiosidade

Você poderia utilizar prototipos do javascript para fazer algo como uma DSL, da seguinte forma

"R$ 1,00".money()
"R$ 1,00".add("R$ 2,00")

Ou se gosta do estilo jQuery

$$("R$ 1,00").add("R$ 1,00").to("USD")
//Ou
$$("BRL 1.00").add("BRL 1.00").to("USD")
//Ou
$$("BRL 1.00").usd()

Utilizar o formato monetário real seria o melhor:

$$("R$ 1,00").add("R$ 1,00").to("$").mul(3)

É uma solução interessante se você for trabalhar só com nativos brasileiro, caso contrario tem que definir a nacionalidade de alguma forma. Pois mais de uma nacionalidade pode utilizar o '$' como símbolo monetário.

3
  • A segunda metade da resposta está excelente, mas acho que não me expressei bem quanto aos requisitos: 2) interoperabilidade no sentido que o servidor pode receber/enviar decimais (1.25) enquanto o js pode usar inteiros como você sugeriu (125) ou outra representação; 3) Robustez no sentido que o usuário pode digitar usando ponto, vírgula, com ou sem o R$, etc, e o sistema tem de interpretar corretamente ou falhar consistentemente. Já a confiabilidade está bem coberta pelo trecho que você citou ("multiplicar por meio de grandeza escalar", "prestar atenção ao tipo", etc).
    – mgibsonbr
    Commented 1/04/2014 às 4:39
  • Mas como assim o usuário pode digitar um ponto ou uma vírgula? No português brasileiro, a vírgula é separador de decimal e o ponto é separador de centena, se o usuário digitar um desses caracteres de forma incorreta, é erro dele e ele precisa aprender Português antes de mais nada. Commented 1/04/2014 às 14:42
  • @Marciano.Andrade Sim, mas isso não dá ao BD o direito de "se corromper" rsrs. Por isso falei em "interpretar corretamente ou falhar consistentemente" - tudo bem o sistema rejeitar entradas incorretas, o que ele não pode é achar que 1,000 é 1 e salvar isso.
    – mgibsonbr
    Commented 1/04/2014 às 19:48
19

Encontrei um JSON interessante aqui (e possível original aqui) que têm informação útil para a formatar dinheiro. Faltam 3 aspectos que seria interessante ter:

  • como separar a partir de 999, o ponto costuma ser usado.
  • como separar valores decimais. Algumas moedas parece que nem sequer têm, mas a ter não diz como separar.
  • em que lado do valor fica o nome da moeda. Se deve ser 100£ ou £100. Presumo que seja o segundo caso.

De qualquer maneira, usando este JSON, aqui fica uma sugestão de função para dar uma lavagem ao formato :) Fiz um update à função para aceitar somente numeros e retornar somente strings com formato x.xxx,xx, para gerar pelo menos dados consistentes.

function lavarDinheiro(moeda, valor) {
    if (typeof valor != 'number') return false; // para garantir que o input é um numero
    valor = ('' + valor).replace(',', '.');
    valor = ('' + valor).split('.');
    var parteInteira = valor[0] + '';
    var parteDecimal = valor[1];

    // tratar a parte inteira
    var rx = /(\d+)(\d{3})/;
    parteInteira = parteInteira.replace(/^\d+/, function (w) {
        while (rx.test(w)) {
            w = w.replace(rx, '$1.$2');
        }
        return w;
    });

    // tratar a parte decimal
    var formatoDecimal = json[moeda].decimal_digits;

    if (parteDecimal) parteDecimal = parteDecimal.slice(0, formatoDecimal);
    else if (!parteDecimal && formatoDecimal) {
        parteDecimal = '';
        while (parteDecimal.length < formatoDecimal) {
            parteDecimal = '0' + parteDecimal;
        }
    }
    return parteDecimal ? [parteInteira, parteDecimal].join(',') : parteInteira;
}

Exemplo

0
11

O ideal para representação de dinheiro em é utilizando uma estrutura de dados mais complexa, que guarde o valor decimal, o valor inteiro, o separador de vírgula, etc.

Há várias pequenas bibliotecas em para manipular dinheiro que seguem por este caminho, poupando você da preocupação de ter que cuidar disso manualmente:

9

Depende o tamanho e precisão do valor com que você quer lidar:

  • Se forem valores menores que $200 milhões e precisão de centavos, como é o caso de muitas aplicações simples. utilize números inteiros, representando CENTAVOS, não reais. Insira a vírgula ou ponto apenas na hora de mostrar ao usuário ou imprimir.

  • Se forem valores maiores que $200 milhões, você vai precisar criar um objeto "Currency" ou similar, que armazene o número

  • Se forem valores com precisão variável (alguns em centavos, outros com 4 casas decimais etc) uma biblioteca tipo BigDecimal é o caminho.

8

Ao invés de armazenar o valor com separador decimal, porque não armazenar a quantidade de centavos por exemplo, ou seja, basta determinar a quantidade mínima de dinheiro a ser armazenada, e armazenar os múltiplos dessa unidade mínima... assim não teria problemas de arredondamento com os cálculos.

No input, considerar '.' ou ',' como separador, é uma boa tática. Se o usuário copiar de outro lugar um valor, poderia considerar somente o último separador como sendo o decimal.

No output, ai teria de configurar qual é o formato a ser usado, pois depende do público alvo do sistema.

3

Para quem precisar de uma solução rápida para resolver pequenos problemas, segue umas funçõeszinhas simples em javascript:

    <script>

    // Abaixo seguem 3 funções genéricas que podem ser utilizadas em qualquer lugar


    // Converte   [valor texto com vírgula para  centavos]    para    [float]

    function textoParaFloat(texto)
    {
        // Retira pontos que separam milhar se existirem. Ex: 1.000,25 vira 1000,25
        texto = texto.replace("." , "");

        // Substitui vírgula separando a casa decimal por ponto ex: 1000,25 vira 1000.25
        texto = texto.replace("," , "."); // isso é necessário para converter para float corretamente

        // Converte de texto para número real
        numero = parseFloat(texto);

        return numero;  // Retorna um número float para ser usado para fazer cálculos    
    }



    // Converte   [valor float com ponto para casa decimal]  para  [texto com vírgula para separar centavos]

    function floatParaTexto(numero)
    {
        numero = numero.toFixed(2); // Duas casas decimais

        texto = numero.toString(); 
        texto = texto.replace("." , ","); // substitui a vírgula por ponto 

        return texto;
    }



    // Apenas prevenção para pessoas que digitam ponto de milhar por costume
    function removePonto(x)
    {
        x.value = x.value.replace('.', '');
    }

    </script>





    Valor: <input type="text" name="valor" id="valor" onkeyup="removePonto(this)"><br>
    <small>Digite apenas números e vírgula para separar os centavos</small>
    <br><br>

    Qtd:   <input type="text" name="qtd"   id="qtd"><br>
    <small>Digite apenas números</small>
    <br><br>

    <input type="button" value="Calcular" onclick="testar();">
    <br><br>
    
    Valor calculado: <span id="teste"></span>




    <script>
    // Essa função abaixo testa as funções genéricas declaradas no bloco de script acima, com os valores digitados

    function testar()
    {
        valor_texto = document.getElementById("valor").value;

        // Convertendo valor_texto com vírgula  para  float  para poder usar em cálculo
        valor_float = textoParaFloat(valor_texto);

        qtd = document.getElementById("qtd").value;
        qtd = parseInt(qtd);

        valor_vezes_qtd = valor_float * qtd; // Esse é um valor númerico calculado

        // converte o valor multiplicado para texto com vírgula
        valor_multiplicado_texto = floatParaTexto(valor_vezes_qtd);

        //exibe o valor multiplicado na tela
        document.getElementById("teste").innerHTML = valor_multiplicado_texto;
    }
    </script>

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 .