2

Estou fazendo uma chamada AJAX e está me retornando uma array de objetos da seguinte maneira:

[
  {
    "area": "607,55"
  },
  {
    "area": "2.415,67"
  },
  {
    "area": "280,53"
  },
  {
    "area": "203,05"
  },
  {
    "area": "296,13"
  }
]

Eu gostaria de somar todas as áreas, e estou fazendo da seguinte forma utilizando o .replace para trocar a vírgula:

let calculaArea = [];     
   result.forEach(function (result) {

         calculaArea.push(parseFloat(result.area.replace(/,/,'')));

       });
//console.log(calculaArea)
[
  60755,
  2.41567,
  28053,
  20305,
  29613
]
/////retornando array com numeros sem virgula/////

Em seguida estou somando a array de objetos assim:

 let totalArea = calculaArea.reduce(function (a, b) {
                    return (a + b);
              });
///console.log(totalArea);
///
138728.41567000002
///

Já dei uma olhada em várias respostas aqui porém os mesmos só trabalha com poucas casas - exemplo: 3.28 = 3,28.

Existe algum um método mais eficaz pra somar array que contenha pontos e vírgulas, e que mantenha 2 casas depois da vírgula?

2 Respostas 2

4

Segundo a documentação, parseFloat considera que o ponto é o separador das casas decimais. Sendo assim, não basta remover a vírgula, pois o segundo número passa a ser 2.41567, que é interpretado como 2,41567 e não é isso que queremos.

Então o jeito é primeiro fazer um replace para remover todos os pontos, e no final trocamos a vírgula por ponto:

let valores = [
  {
    "area": "607,55"
  },
  {
    "area": "2.415,67"
  },
  {
    "area": "280,53"
  },
  {
    "area": "203,05"
  },
  {
    "area": "296,13"
  }
];

let total = valores
    // transforma as strings da área em números
    .map(v => parseFloat(v.area.replace(/\./g, '').replace(',', '.')))
    // somar tudo e arredondar para duas casas decimais
    .reduce( (a, b) => a + b).toFixed(2);
console.log(total);

// ou, se quiser formatar o valor para usar pontos como separador de milhares e vírgulas como separador decimal
let totalNum = valores
    // transforma as strings da área em números
    .map(v => parseFloat(v.area.replace(/\./g, '').replace(',', '.')))
    // somar tudo e arredondar para duas casas decimais
    .reduce( (a, b) => a + b);
console.log(Intl.NumberFormat('pt-BR', { minimumFractionDigits: 2, maximumFractionDigits: 2}).format(totalNum));

O primeiro replace usa \. para pegar todos os pontos da string (a flag g indica que quero substituir todas as ocorrências, já que podemos ter valores acima de 1 milhão podem ter mais de um ponto). O segundo replace troca a vírgula por ponto, e no final temos a string no formato que parseFloat entende.

Note que a ordem é importante. Por exemplo, se tivermos a string 1.234,56:

  • se eu trocar primeiro a vírgula por ponto, ela passa a ser 1.234.56, e se eu remover os pontos, ela vira 123456 (mais cento e vinte mil, um valor completamente diferente do original).
  • trocando primeiro o ponto, ela vira 1234,56, e trocando a vírgula por ponto, ela passa a ser 1234.56, que parseFloat interpreta corretamente como sendo "mil duzentos e trinta e quatro, vírgula, cinquenta e seis".

Depois basta somar e usar toFixed para arredondar o resultado para duas casas decimais. Lembrando que toFixed de fato arredonda (2.345 arredondado para duas casas vira 2.35).

Vale lembrar também que toFixed retorna uma string. Se quiser o valor numérico, pegue o retorno de reduce diretamente. Só não se esqueça desse detalhe.


Também incluí uma segunda opção, para formatar o valor numérico usando o ponto como separador de milhares e vírgula como separador decimal (além de considerar sempre duas casas decimais). Para mais detalhes, veja a documentação de NumberFormat.

3
  • amigo @hkotsubo muito obrigado também testei seu código alterando algumas coisas e funcionou perfeitamente, queria saber se e possivel com esse resultado adicionar a "," virgula para ficar float real neste exemplo "3.802,93" obrigado mesmo!! Commented 14/10/2019 às 18:47
  • 1
    @luiz_vitorr Atualizei a resposta com essa opção. E só para lembrar como o site funciona: se uma das respostas resolveu o seu problema, vc pode escolher a que melhor resolveu e aceitá-la, veja aqui como e porque fazê-lo. Não é obrigatório, mas é uma boa prática do site, para indicar a futuros visitantes que aquilo resolveu o problema. Não esqueça que vc também pode votar em todas as respostas que achou úteis.
    – hkotsubo
    Commented 14/10/2019 às 18:53
  • obrigado @hkotsubo estarei positivando a resposta e dizer que você foi de grande ajuda pelas dica Commented 14/10/2019 às 19:03
2

Para pegar um valor em javascript, eu transformo em Number dessa maneira.

 vp = Number(ValorTotalPedido.replace(/[R\$ \.]/g, '').replace(',', '.'));

Você teria que fazer mais ou menos assim:

 calculaArea.push(Number(result.area.replace(/[R\$ \.]/g, '').replace(',', '.')));

Tente desta maneira. Você vai ter que configurar quando estiver passando o parâmetro.

2
  • obrigado mariana sua resposta funcionou perfeitamente, eu iria pergunta logo em seguida como fazer pra colocar as 2 casas decimais depois da virgula.. o outro amigo @hkotsubo respondeu logo a cima.. então voces 2 me ajudaram muito!! Commented 14/10/2019 às 18:43
  • 1
    @luiz_vitorr que bom que te ajudou. Estamos as ordens.
    – Mariana
    Commented 14/10/2019 às 19:40

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 .