Сложение(+) в JavaScript

378
15 июня 2017, 08:04

Здравствуйте, при скрипте:

function pl(){
//document.getElementById('inp2').value
alert(document.getElementById('inp2').value+document.getElementById('inp2').value);
}

Если value=12, выдает 1212.. Что и как нужно сделать, чтобы получилось 24?

Answer 1

Аттрибуты являются строками и оператор + является для них операцией конкатенации. Для сложения строк как чисел, нужно явно распарсить строку в число.

Например функция parseInt:

alert(parseInt(document.getElementById('inp2').value)+parseInt(document.getElementById('inp2').value));

Еще есть вариант через унарный оператор +:

var test1 = +document.getElementById('inp2').value; alert(test1+test1)

На learn.javascript.ru можно прочитать подробней про преобразования.

UPDATE

Есть особенность работы parseInt: в разных браузерах строки, которые начинаются с 0 ( например '010') могут преобразоваться либо в восмеричную( в примере получится 8), либо в десятичную систему счисления. Описание на mdn.

По спецификации ecmascript 5 по умолчанию явно задаётся десятичная система счисления, т.е. parseInt('010') -> 10

Answer 2

value у inputа содержит строку. А сложение превращается в конкатенацию если хотя бы один из аргументов - строка. Чтобы привести строку к числу надо использовать унарный плюс.

var s = "12", x = 12; 
 
console.log(JSON.stringify(s + s));   // "1212" 
console.log(JSON.stringify(s + x));   // "1212" 
console.log(JSON.stringify(x + s));   // "1212" 
console.log(JSON.stringify(x + x));   // 24 
 
var y = +s; 
 
console.log(JSON.stringify(y + y));   // 24

Answer 3

используйте parseInt(строкаВвидеЧисла)

function pl(){ 
 if(document.getElementById('inp2').value == "") { 
alert("0"); 
} 
else { 
alert(parseInt(document.getElementById('inp2').value)+parseInt(document.getElementById('inp2').value)); 
 
} 
 
}
<input id="inp2" type="number" required> 
<button onclick="pl()">Сложить</button>

READ ALSO
Узнать количество элементов в массиве

Узнать количество элементов в массиве

Как узнать количество элементов в массиве?

299
Как вставить input в Angular 2

Как вставить input в Angular 2

I want to replace certain words with input fields, I have created method, that must replace and Pipe for safe insert of input field, but it doesn't work

297
Что делает функция в программе? React.JS

Что делает функция в программе? React.JS

Прохожу курс по ReactJS на Codeacademy

323