Як додати два рядки так, ніби вони були числами?


176

У мене є два рядки, які містять лише числа:

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

Я б очікував, що я можу додати їх разом, але замість них вони об'єднуються:

num1 + num2; // = '2030.5'

Як змусити ці рядки розглядатися як числа?

Відповіді:


378

Я б скористався оператором unary plus, щоб спершу їх перетворити на числа.

+num1 + +num2;

9
Дуже круто. Дякуємо, що поділилися цим. Я знайшов цю статтю, яка описує оператор unary plus та деякі корисні впливи, які він впливає на різні типи даних. xkr.us/articles/javascript/unary-add
mrtsherman

4
Але якщо ці числа перевищують 2 ^ 53, вам доведеться створити функцію для додавання частин рядків і перенесення переносів до кожної частини в циклі. : D
trusktr

2
Це призвело до помилки, тому я використовував parseFloat () замість цього.
Хокі

1
Дивіться також @NicholasCarey відповідь нижче: stackoverflow.com/a/8976770/1579667
Benj

Чи є менш хакітний спосіб зробити це? (Відмова: саме так я завжди робив.)
Бісквіт

20

Документи MDN для розборуІнструменти
MDN для парсеФлоат

У 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'));
}

2
використовуйте parseFloat (), якщо у вас десяткові дроби. :)
Діод - Джеймс Макфарлейн

1
Також дійсно слід вказати
радіус

І +num1 + +num2коротше, імовірно, витонченіше. В основному одинарний +оператор перетворюється наNumber
Райнос

Чи не втрачаєте ви .5 десяткової, коли ви аналізуєте?
DOK

Що для цього варто, parseInt & parseFloat є експериментальними і не підтримуються широко в браузерах - майже немає підтримки на мобільних пристроях.
Буде чи

14

Я рекомендую використовувати оператор unary plus, щоб змусити можливий рядок вважати числом у внутрішніх дужках, щоб зробити код читабельнішим як наступний:

(+varname)

Отже, у вашому випадку це:

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

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

// Just to test it
console.log( sum ); // 50.5



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;
}


4

спробуйте

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

або, залежно від ваших потреб:

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

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

Можливо, ви захочете забрати книгу Javascript: хороші частини Дугласа Крокфорда. У Javascript є досить значний колекція ґетчей! Ця книга проходить довгий шлях до їх роз'яснення. Дивитися також

та чудовий нарис містера Крокфорда, Javascript: Найпомітніша мова програмування у світі .


3

Я завжди просто віднімав нуль.

num1-0 + num2-0;

Зрозуміло, що метод одинарного оператора є одним символом менше, але не всі знають, що таке одинарний оператор або як Google, щоб дізнатись, коли вони не знають, що це викликається.


2

Якщо ви хочете виконати операцію з числами як рядки (як у випадку, коли числа можуть перевищувати 64 біти), ви можете використовувати бібліотеку великих цілих чисел .

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

2

Тут у вас є два варіанти:

1.Ви можете використовувати унарний плюс для перетворення номера рядка в ціле число.

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

.

Зараз я збираюся показати вам тут за допомогою прикладів (Знайдіть суму двох чисел).

Використання оператора unary 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>

Використання підходу до аналізу

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


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;
}

0

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

parseFloat(num1) + parseFloat(num2)

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;

У моєму випадку працює, якщо ви зіткнулися з тією ж проблемою, що і я, і не можете знайти рішення для цього випадку і знайти це питання.

Вибачте за трохи поза теми, але, як тільки я з'ясував, що це працює, я подумав, що варто було б поділитися.

Не знаю, чи це брудне вирішення чи насправді законний.


-1

Ви можете використовувати так:

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

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

Застосовуючи * 1 у num1, перетворіть рядок у число.

якщо num1 містить букву або кому, повертає NaN, помножившись на 1

якщо num1 є нульовим, num1 повертає 0

З повагою!!!


-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://informativejavascript.blogspot.nl/2012/12/javascript-basics.html

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.