Как добавить две строки, как если бы они были числами?

176

У меня есть две строки, которые содержат только цифры:

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

Я бы ожидал, что смогу добавить их вместе, но вместо этого они объединяются:

num1 + num2; // = '2030.5'

Как я могу заставить эти строки рассматриваться как числа?

Андрей
источник

Ответы:

378

Я бы использовал унарный оператор плюс, чтобы сначала преобразовать их в числа.

+num1 + +num2;
ChaosPandion
источник
9
Очень круто. Спасибо, что поделились этим. Я нашел эту статью, которая описывает унарный оператор плюс и некоторые полезные эффекты, которые он оказывает на разные типы данных. xkr.us/articles/javascript/unary-add
mrtsherman
4
Но если эти числа больше 2 ^ 53, вам нужно создать функцию для добавления частей строк и переноса переносов на каждую часть в цикле. : D
trusktr
2
Это дало мне ошибку, поэтому я использовал parseFloat () вместо этого.
Хоки
1
Смотрите также ответ @NicholasCarey ниже: stackoverflow.com/a/8976770/1579667
Бендж
Есть ли менее хакерский способ сделать это? (Отказ от ответственности: это то, как я всегда делал это.)
Бисквит
20

MDN документы для parseInt
MDN документы для parseFloat

В parseInt radix задается как десять, так что мы находимся в базе 10. В нестрогом javascript число с префиксом 0рассматривается как восьмеричное. Это, очевидно, вызовет проблемы!

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

Также смотрите ответ ChaosPandion для полезного ярлыка с использованием унарного оператора . Я настроил скрипку, чтобы показать различное поведение.

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
источник
2
используйте parseFloat (), если у вас есть десятичные дроби. :)
Диодей - Джеймс Макфарлейн
1
Также вы действительно должны указать основание как 10.
ChaosPandion
И +num1 + +num2короче, возможно, более элегантно. В основном унарный +оператор преобразуется вNumber
Raynos
Разве вы не теряете .5 десятичный, когда вы делаете parseInt?
ДОК
Что бы это ни стоило, parseInt & parseFloat являются экспериментальными и широко не поддерживаются в разных браузерах - практически не поддерживается на мобильных устройствах.
Будет
14

Я бы порекомендовал использовать унарный оператор плюс для принудительной обработки конечной строки как числа внутри скобок, чтобы сделать код более читабельным, как показано ниже:

(+varname)

Итак, в вашем случае это:

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

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

// Just to test it
console.log( sum ); // 50.5
Люка Боррионе
источник
12
var result = Number(num1) + Number(num2);
не определено
источник
6

Если вам нужно добавить две строки вместе, которые являются очень большими числами, вам нужно оценить сложение в каждой позиции строки:

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
источник
5

Вы можете использовать это, чтобы добавить номера:

var x = +num1 + +num2;
Гурвиндер Сингх
источник
4

пытаться

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

или, в зависимости от ваших потребностей:

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

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

Возможно, вы захотите купить книгу Дугласа Крокфорда « Javascript: The Good Parts ». Javascript имеет довольно значительную коллекцию ошибок! Эта книга имеет большое значение для их разъяснения. Смотрите также

и превосходное эссе г-на Крокфорда, Javascript: самый неправильно понятый в мире язык программирования .

Николас Кэри
источник
3

Я всегда просто вычитал ноль.

num1-0 + num2-0;

Конечно, метод унарного оператора на один символ меньше, но не все знают, что такое унарный оператор или как в Google узнать, когда они не знают, как он называется.

adam0101
источник
2

Если вы хотите выполнить операцию с числами в виде строк (как в случае, когда числа больше 64 бит), вы можете использовать библиотеку больших целых чисел .

const bigInt = require('big-integer')
bigInt("999").add("1").toString() // output: "1000"
Марсело Лазарони
источник
2

Здесь у вас есть два варианта сделать это:

1. Вы можете использовать унарный плюс, чтобы преобразовать номер строки в целое число.

2. Вы также можете добиться этого путем анализа числа в соответствующий тип. т.е. parseInt (), parseFloat () и т. д.

,

Теперь я собираюсь показать вам здесь с помощью примеров (Найти сумму двух чисел).

Используя унарный оператор плюс

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

Используя подход парсинга

<!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>
Браджеш
источник
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 ;
}
Сохам дас
источник
1

Вы можете использовать parseIntдля разбора строки на число. Чтобы быть в безопасности, всегда передавайте 10второй аргумент для разбора в базе 10.

num1 = parseInt(num1, 10);
num2 = parseInt(num2, 10);
alert(num1 + num2);
Алекс Турпин
источник
1

Убедитесь, что вы округлили свой окончательный ответ до 16 знаков после запятой для чисел с плавающей запятой, поскольку скрипт Java содержит ошибки.

Например 5 - 7,6 = -2,5999999999999996

никола
источник
1
JavaScript не глючит, он использует ту же IEEE754 с плавающей запятой, что и большинство других. Отмеченная вами неточность является естественным следствием использования двоичной арифметики с плавающей запятой для чисел, которые вы указываете и отображаете в десятичном виде.
Майкл Гири
1

@ cr05s19xx предложили по дублирующему вопросу:

JavaScript немного забавен, когда дело доходит до чисел и сложений.

Давать следующее

«20» - «30» = 10; // возвращает 10 как число '20' + '30' = '2030'; // Возвращает их в виде строки. Значения, возвращаемые из document.getElementById, являются строками, поэтому лучше проанализировать их все (даже те, которые работают) для нумерации, прежде чем продолжить сложение или вычитание. Ваш код может быть:

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
источник
0

Используйте parseFloatметод для разбора строк на числа с плавающей точкой:

parseFloat(num1) + parseFloat(num2)
Guffa
источник
0

Я использую это в своем проекте. Я использую знак +, чтобы рассматривать строку как число (в переменной 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>

Надеюсь, поможет


источник
0
document.getElementById(currentInputChoosen).value -= +-100;

Работает в моем случае, если вы столкнулись с той же проблемой, что и я, и не можете найти решение для этого случая и найти этот вопрос SO.

Извините за немного не по теме, но, как только я узнал, что это работает, я подумал, что стоит поделиться.

Не знаю, если это грязный обходной путь, или на самом деле законно.

Римский
источник
-1

Вы можете использовать так:

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

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

Когда применяется * 1 в num1, преобразуйте строку в число.

если num1 содержит букву или запятую, возвращает NaN, умноженное на 1

если num1 равен нулю, num1 возвращает 0

с уважением!!!

Seconddj
источник
-2

Попробуйте это, если вы ищете простой код Javascript и хотите использовать два поля ввода и добавить числа из двух значений. Вот код

    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>

Для получения более подробной информации, пожалуйста, посетите http://inforrativejavascript.blogspot.nl/2012/12/javascript-basics.html

Камаль
источник