¿Cómo agregar dos cadenas como si fueran números?

176

Tengo dos cadenas que contienen solo números:

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

Hubiera esperado poder agregarlos, pero en su lugar se están concatenados:

num1 + num2; // = '2030.5'

¿Cómo puedo forzar que estas cadenas sean tratadas como números?

Andrés
fuente

Respuestas:

378

Usaría el operador unario más para convertirlos primero a números.

+num1 + +num2;
ChaosPandion
fuente
9
Muy genial. Gracias por compartir esto. Encontré este artículo que describe el operador unario plus y algunos de los efectos útiles que tiene en diferentes tipos de datos. xkr.us/articles/javascript/unary-add
mrtsherman
44
Pero si esos números son mayores que 2 ^ 53, tendrá que crear una función para agregar partes de las cadenas y llevar los acarreos a cada parte en un bucle. : D
trusktr
2
Esto me dio un error, así que usé parseFloat () en su lugar.
Hawkee
1
Consulte también la respuesta de @NicholasCarey a continuación: stackoverflow.com/a/8976770/1579667
Benj
¿Hay alguna manera menos hacky de hacer esto? (Descargo de responsabilidad: así es como siempre lo he estado haciendo)
Seebiscuit
20

Documentos de MDN para parseInt
Documentos de MDN para parseFloat

En parseInt radix se especifica como diez para que estemos en la base 10. En javascript no estricto, un número antepuesto 0se trata como octal. ¡Esto obviamente causaría problemas!

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

También vea la respuesta de ChaosPandion para un atajo útil usando un operador unario . He configurado un violín para mostrar los diferentes comportamientos.

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
fuente
2
use parseFloat () si tiene decimales. :)
Diodeus - James MacFarlane
1
También deberías especificar la raíz como 10.
ChaosPandion
Y +num1 + +num2es más corto, posiblemente más elegante. Básicamente, el +operador unario se convierte aNumber
Raynos
¿No pierdes el .5 decimal cuando analizas?
DOK
Por lo que vale, parseInt y parseFloat son experimentales y no son ampliamente compatibles en todos los navegadores, casi no son compatibles con dispositivos móviles.
Se
14

Recomendaría usar el operador unario más, para forzar que una cadena eventual se trate como un número, dentro del paréntesis para hacer que el código sea más legible como el siguiente:

(+varname)

Entonces, en tu caso es:

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

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

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

Si necesita agregar dos cadenas juntas que son números muy grandes, deberá evaluar la suma en cada posición de cadena:

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
fuente
5

Puede usar esto para agregar números:

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

tratar

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

o, según sus necesidades:

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

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

Es posible que desee recoger el libro Javascript: The Good Parts , de Douglas Crockford. ¡Javascript tiene una colección de gotchas bastante considerable! Este libro recorre un largo camino para aclararlos. Ver también

y el excelente ensayo del Sr. Crockford, Javascript: el lenguaje de programación más incomprendido del mundo .

Nicholas Carey
fuente
3

Siempre he restado cero.

num1-0 + num2-0;

Concedido que el método del operador unario es un carácter menos, pero no todos saben qué es un operador unario o cómo buscar en Google para saber cuándo no saben cómo se llama.

adam0101
fuente
2

Si desea realizar operaciones con números como cadenas (como en el caso de que los números sean mayores de 64 bits), puede usar la biblioteca de enteros grandes .

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

Aquí, tiene dos opciones para hacer esto: -

1.Puede usar el unario más para convertir el número de cadena en entero.

2. También puede lograr esto analizando el número en el tipo correspondiente. es decir, parseInt (), parseFloat (), etc.

.

Ahora te voy a mostrar aquí con la ayuda de ejemplos (Encuentra la suma de dos números).

Uso del operador unario plus

<!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 el enfoque de análisis

<!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
fuente
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
fuente
1

Puede usar parseIntpara analizar una cadena a un número. Para estar seguro, siempre pase 10como segundo argumento para analizar en la base 10.

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

Asegúrese de redondear su respuesta final a menos de 16 decimales para las carrozas, ya que el script java tiene errores.

Por ejemplo 5 - 7.6 = -2.5999999999999996

Nicolas
fuente
1
JavaScript no tiene errores, utiliza el mismo punto flotante IEEE754 que la mayoría de los demás. La imprecisión que observó es una consecuencia natural del uso de la aritmética de coma flotante binaria en los números que especifique y muestre en decimal.
Michael Geary
1

@ cr05s19xx sugerido en una pregunta duplicada:

JavaScript es un poco divertido cuando se trata de números y sumas.

Dando lo siguiente

'20' - '30' = 10; // devuelve 10 como un número '20' + '30' = '2030'; // Los devuelve como una cadena Los valores devueltos por document.getElementById son cadenas, por lo que es mejor analizarlos todos (incluso el que funciona) para numerarlos, antes de continuar con la suma o resta. Tu código puede 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
fuente
0

Use el parseFloatmétodo para analizar las cadenas en números de punto flotante:

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

Lo uso en mi proyecto. Uso + signo para tratar la cadena como un número (en la variable 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 eso ayude


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

Funciona en mi caso, si te encuentras con el mismo problema que yo y no puedes encontrar una solución para ese caso y encuentras esta pregunta SO.

Lo siento por un poco fuera de tema, pero como acabo de descubrir que esto funciona, pensé que valdría la pena compartirlo.

No sé si es una solución sucia, o si es realmente legítima.

romano
fuente
-1

Puedes usar así:

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

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

Cuando aplique * 1 en num1, convierta la cadena en un número.

si num1 contiene una letra o una coma, devuelve NaN multiplicando por 1

si num1 es nulo, num1 devuelve 0

¡¡¡Saludos cordiales!!!

Seconddj
fuente
-2

Pruebe esto si está buscando un código Javascript simple y desea usar dos cuadros de entrada y agregar números a partir de los dos valores. Aquí está el 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 obtener más detalles, visite http://informativejavascript.blogspot.nl/2012/12/javascript-basics.html

kamal
fuente