Como adicionar duas strings como se fossem números?

176

Eu tenho duas cadeias que contêm apenas números:

var num1 = '20',
    num2 = '30.5';

Eu esperava poder adicioná-los, mas eles estão sendo concatenados:

num1 + num2; // = '2030.5'

Como posso forçar essas seqüências a serem tratadas como números?

Andrew
fonte

Respostas:

378

Eu usaria o operador unary plus para convertê-los em números primeiro.

+num1 + +num2;
ChaosPandion
fonte
9
Muito legal. Obrigado por compartilhar isso. Encontrei este artigo que descreve o operador unary plus e alguns dos efeitos úteis que ele tem sobre diferentes tipos de dados. xkr.us/articles/javascript/unary-add
mrtsherman
4
Mas se esses números forem maiores que 2 ^ 53, será necessário criar uma função para adicionar partes das seqüências de caracteres e transportar as transições para cada parte em um loop. : D
trusktr
2
Isso me deu um erro, então usei parseFloat ().
Hawkee 31/07
1
Veja também a resposta de @NicholasCarey abaixo: stackoverflow.com/a/8976770/1579667
Benj
Existe uma maneira menos hacky de fazer isso? (Disclaimer:. É assim que eu sempre fui fazendo isso)
seebiscuit
20

Documentos MDN para parseInt
Documentos MDN para parseFloat

Em parseInt, radix é especificado como dez, de modo que estamos na base 10. No javascript não restrito, um número precedido por um número 0é tratado como octal. Obviamente, isso causaria problemas!

parseInt(num1, 10) + parseInt(num2, 10) //base10
parseFloat(num1) + parseFloat(num2)

Veja também a resposta do ChaosPandion para obter um atalho útil usando um operador unário . Criei um violino para mostrar os diferentes comportamentos.

http://jsfiddle.net/EtX6G/

var ten = '10';
var zero_ten = '010';
var one = '1';
var body = document.getElementsByTagName('body')[0];

Append(parseInt(ten) + parseInt(one));
Append(parseInt(zero_ten) + parseInt(one));
Append(+ten + +one);
Append(+zero_ten + +one);

function Append(text) {
    body.appendChild(document.createTextNode(text));
    body.appendChild(document.createElement('br'));
}
Mrtsherman
fonte
2
use parseFloat () se você tiver decimais. :)
Diodeus - James MacFarlane
1
Além disso, você realmente deve especificar a raiz como 10.
ChaosPandion
E +num1 + +num2é mais curto, sem dúvida mais elegante. Basicamente, o +operador unário se converte emNumber
Raynos
Você não perde o decimal .5 quando faz a análise?
DOK 23/01
Pelo que vale, o parseInt e o parseFloat são experimentais e não são amplamente suportados pelos navegadores - quase sem suporte no celular.
Will
14

Eu recomendaria usar o operador unary plus, para forçar uma eventual sequência a ser tratada como número, entre parênteses, para tornar o código mais legível da seguinte forma:

(+varname)

Então, no seu caso, é:

var num1 = '20',
    num2 = '30.5';

var sum = (+num1) + (+num2);

// Just to test it
console.log( sum ); // 50.5
Luca Borrione
fonte
12
var result = Number(num1) + Number(num2);
Indefinido
fonte
6

Se você precisar adicionar duas strings juntas, que são números muito grandes, será necessário avaliar a adição em todas as posições da string:

function addStrings(str1, str2){
  str1a = str1.split('').reverse();
  str2a = str2.split('').reverse();
  let output = '';
  let longer = Math.max(str1.length, str2.length);
  let carry = false;
  for (let i = 0; i < longer; i++) {
    let result
    if (str1a[i] && str2a[i]) {
      result = parseInt(str1a[i]) + parseInt(str2a[i]);

    } else if (str1a[i] && !str2a[i]) {
      result = parseInt(str1a[i]);

    } else if (!str1a[i] && str2a[i]) {
      result = parseInt(str2a[i]);
    }

    if (carry) {
        result += 1;
        carry = false;
    }
    if(result >= 10) {
      carry = true;
      output += result.toString()[1];
    }else {
      output += result.toString();
    }
  }
  output = output.split('').reverse().join('');

  if(carry) {
    output = '1' + output;
  }
  return output;
}
kugyousha
fonte
5

Você pode usar isso para adicionar números:

var x = +num1 + +num2;
Gurwinder Singh
fonte
4

experimentar

var x = parseFloat(num1) + parseFloat(num2) ;

ou, dependendo de suas necessidades:

var x = parseInt(num1) + parseInt(num2) ;

http://www.javascripter.net/faq/convert2.htm

Convém pegar o livro Javascript: The Good Parts , de Douglas Crockford. Javascript tem uma coleção considerável de dicas! Este livro ajuda bastante a esclarecê-los. Veja também

e o excelente ensaio do Sr. Crockford, Javascript: a linguagem de programação mais incompreendida do mundo .

Nicholas Carey
fonte
3

Eu sempre subtraí zero.

num1-0 + num2-0;

Concedido que o método do operador unário é um caractere a menos, mas nem todo mundo sabe o que é um operador unário ou como pesquisar no Google quando não sabe o que é chamado.

adam0101
fonte
2

Se você deseja executar uma operação com números como seqüências de caracteres (como no caso de números maiores que 64 bits), use a biblioteca de números grandes grandes .

const bigInt = require('big-integer')
bigInt("999").add("1").toString() // output: "1000"
Marcelo Lazaroni
fonte
2

Aqui, você tem duas opções para fazer isso: -

1.Você pode usar o plus unário para converter o número da string em número inteiro.

2. Você também pode conseguir isso analisando o número no tipo correspondente. parseInt (), parseFloat () etc

.

Agora vou mostrar aqui com a ajuda de exemplos (encontre a soma de dois números).

Usando o operador mais unário

<!DOCTYPE html>
<html>
<body>

<H1>Program for sum of two numbers.</H1>
<p id="myId"></p>
<script>
var x = prompt("Please enter the first number.");//prompt will always return string value
var y = prompt("Please enter the second nubmer.");
var z = +x + +y;    
document.getElementById("myId").innerHTML ="Sum of "+x+" and "+y+" is "+z;
</script>
</body>
</html>

Usando a abordagem de análise

<!DOCTYPE html>
<html>
<body>

<H1>Program for sum of two numbers.</H1>
<p id="myId"></p>
<script>
var x = prompt("Please enter the first number.");
var y = prompt("Please enter the second number.");   
var z = parseInt(x) + parseInt(y);
document.getElementById("myId").innerHTML ="Sum of "+x+" and "+y+" is "+z;
</script>
</body>
</html>
Brajesh
fonte
2
function sum(){
    var x,y,z;
    x = Number(document.getElementById("input1").value);
    y = Number(document.getElementById("input2").value);
    z = x + y;
    document.getElementById("result").innerHTML = z ;
}
Soham Das
fonte
1

Você pode usar parseIntpara analisar uma string em um número. Para estar no lado seguro das coisas, sempre passe 10como o segundo argumento para analisar na base 10.

num1 = parseInt(num1, 10);
num2 = parseInt(num2, 10);
alert(num1 + num2);
Alex Turpin
fonte
1

Certifique-se de arredondar sua resposta final para menos de 16 casas decimais para carros alegóricos, pois o script java é um buggy.

Por exemplo 5 - 7,6 = -2,5999999999999996

Nicolas
fonte
1
JavaScript não é buggy, ele usa o mesmo ponto flutuante IEEE754 que quase todo o resto. A imprecisão que você anotou é uma consequência natural do uso da aritmética binária de ponto flutuante nos números que você especifica e exibe em decimal.
precisa
1

@ cr05s19xx sugeriu uma pergunta duplicada:

O JavaScript é um pouco engraçado quando se trata de números e adição.

Dando o seguinte

'20' - '30' = 10; // retorna 10 como um número '20' + '30' = '2030'; // Retorna eles como uma string Os valores retornados de document.getElementById são strings, portanto, é melhor analisar todos eles (mesmo aquele que funciona) em número, antes de prosseguir com a adição ou subtração. Seu código pode ser:

function myFunction() {
  var per = parseInt(document.getElementById('input1').value);
  var num = parseInt(document.getElementById('input2').value);
  var sum = (num / 100) * per;
  var output = num - sum;

  console.log(output);

  document.getElementById('demo').innerHTML = output;
}

function myFunction2() {
  var per = parseInt(document.getElementById('input3').value);
  var num = parseInt(document.getElementById('input4').value);
  var sum = (num / 100) * per;
  var output = sum + num;

  console.log(output);

  document.getElementById('demo1').innerHTML = output;
}
Gary
fonte
0

Use o parseFloatmétodo para analisar as seqüências de caracteres em números de ponto flutuante:

parseFloat(num1) + parseFloat(num2)
Guffa
fonte
0

Eu uso isso no meu projeto.Eu uso o sinal + para tratar a string como um número (na variável with_interesst)

<script>
function computeLoan(){
var amount = document.getElementById('amount').value;
var interest_rate = document.getElementById('interest_rate').value;
var days = document.getElementById('days').value;
var interest = (amount * (interest_rate * .01)) / days;
var payment = ((amount / days) + interest).toFixed(2);
var with_interest = (amount * (interest_rate * .01));
var with_interesst = (+amount * (interest_rate * .01)) + (+amount);
payment = payment.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
document.getElementById('payment').innerHTML = "Target Daily = PHP"+payment;
document.getElementById('with_interesst').innerHTML = "Amount w/Interest =   PHP"+with_interesst;
}
</script>

<div name="printchatbox" id="printchatbox">
 <form id="Calculate" class="form-horizontal">
   <h2>You Can Use This Calculator Before Submit </h2>
   <p>Loan Amount: PHP<input id="amount" type="number" min="1" max="1000000"  onchange="computeLoan()"></p>
   <p>Interest Rate: <input id="interest_rate" type="number" min="0" max="100" value="10" step=".1" onchange="computeLoan()">%</p>
    <p>Term<select id="days" type="number" min="1" max="72" step=".1" onchange="computeLoan()">
    <option value="40">40 Days</option>
    <option value="50">50 Days</option>
    <option value="60">60 Days</option>
    <option value="70">70 Days</option>
    <option value="80">80 Days</option>
    <option value="90">90 Days</option>
    <option value="100">100 Days</option>
    <option value="120">120 Days</option>
    </select>
    </p>                        
   <h2 id="payment"></h2>
   <h2 id ="with_interesst"></h2>
 </form>
</div>

Espero que ajude


fonte
0
document.getElementById(currentInputChoosen).value -= +-100;

Funciona no meu caso, se você tiver o mesmo problema que eu e não conseguir encontrar uma solução para esse caso e encontrar essa pergunta SO.

Desculpe por um pouco fora do tópico, mas como acabei de descobrir que isso funciona, pensei que valeria a pena compartilhar.

Não sei se é uma solução alternativa suja ou realmente legítima.

romano
fonte
-1

Você pode usar assim:

var num1 = '20',
    num2 = '30.5';

alert((num1*1) + (num2*1)); //result 50.5

Quando aplicar * 1 em num1, converta uma string em número.

se num1 contiver uma letra ou vírgula, retornará NaN multiplicando por 1

se num1 for nulo, num1 retornará 0

Atenciosamente!!!

Seconddj
fonte
-2

Tente isso se você estiver procurando por um código Javascript simples e quiser usar duas caixas de entrada e adicionar números a partir dos dois valores. Aqui está o código.

    Enter the first number: <input type="text" id="num1" /><br />
    Enter the seccond number: <input type="text" id="num2" /><br />
    <input type="button" onclick="call()" value="Add"/>

    <script type="text/javascript">
    function call(){
    var q=parseInt(document.getElementById("num1").value);
    var w=parseInt(document.getElementById("num2").value);
    var result=q+w;
    }
    </script>

para obter mais detalhes, visite http://informativejavascript.blogspot.nl/2012/12/javascript-basics.html

Kamal
fonte