Add values with jquery, string to number

Question

I’m trying to add some values but instead of a result of the sum I’m getting the values concatenated, follow the example:

var a = 7.5 
var b = 1.00 
var c = 2.0
var d = a+b+c 

console.log(d) = 7.51.00.2.0

But I wanted to get the following value: 7.5 + 1.00 + 2.0 = 10.5 to then convert to R$ and present as R$ 10.50.

How do I turn this concatenated value into the correct sum value?

You should use parseInt something like var d = parseInt(a+b+c) but it didn’t turn out the way I’d hoped.

Update Obs.: In my case some values I am adding as text() inside the tag, in some cases I am taking the date('value') of the tag and adding the value inside it via text(), there is some other way that keeps the number as number and not string?

Answer 1

function formatReal(int){
        var tmp = int+'';
        tmp = tmp.replace(/([0-9]{2})$/g, ",$1");
        if( tmp.length > 6 )
                tmp = tmp.replace(/([0-9]{3}),([0-9]{2}$)/g, ".$1,$2");

        return tmp;
}

let a = document.getElementById('a').textContent;
let b = document.getElementById('b').textContent;
let c = document.getElementById('c').textContent;

let result = parseFloat(a) + parseFloat(b) + parseFloat(c);

$('#result').text('R$ '+formatReal(result));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span id="a">10.5</span>
    <span id="b">18.9</span>
    <span id="c">45.8</span>
    
    <div id="result"></div>

function formatReal(int){
        var tmp = int+'';
        tmp = tmp.replace(/([0-9]{2})$/g, ",$1");
        if( tmp.length > 6 )
                tmp = tmp.replace(/([0-9]{3}),([0-9]{2}$)/g, ".$1,$2");

        return tmp;
}

let a = document.getElementById('a').textContent;
let b = document.getElementById('b').textContent;
let c = document.getElementById('c').textContent;

let result = parseFloat(a) + parseFloat(b) + parseFloat(c);

alert(result)
alert(formatReal(result));

<span id="a">10.5</span>
    <span id="b">18.9</span>
    <span id="c">45.8</span>

let a = 1;
let b = 1000;


alert(a + b);

alert(parseFloat(a) + parseFloat(b));

Follow the example

function parseInt() parses a string argument and returns an integer in the specified base.

The function parseFloat() parses a string argument and returns a floating point number.

let a = document.getElementById('a').textContent;
let b = document.getElementById('b').textContent;
let c = document.getElementById('c').textContent;

alert(parseFloat(a) + parseFloat(b) + parseFloat(c));

<span id="a">10.5</span>
    <span id="b">18.9</span>
    <span id="c">45.8</span>

Answer 2

You’re using numbers in format String, you need to convert to Number.

A suggestion, using a function that allows N arguments:

var a = 6547.5;
var b = 1345354.0054;
var c = 2.0;


function somar() {
  var numeros = [].map.call(arguments, Number);
  var total = numeros.reduce(function(soma, nr) {
    return soma + nr;
  }, 0);
  return total.toLocaleString('pt-BR', {
    minimumFractionDigits: 2,
    maximumFractionDigits: 2
  });
}

var d = somar(a, b, c);
console.log('R$ ' + d);