Як змусити JS займатися математикою, а не ставити два рядки

Мені потрібен javascript, щоб додати 5 до цілочисленної змінної, але замість цього вона розглядає змінну як рядок, тому вона виписує змінну, а потім додає 5 на кінець "рядка". Як я можу змусити її замість цього робити математику?

var dots = document.getElementById("txt").value; // 5
function increase(){
    dots = dots + 5;
}

Вихід: 55

Як я можу змусити його вивести 10?

У вас є лінія

dots = document.getElementById("txt").value;

у вашому файлі це встановить крапки як рядок, оскільки вміст txt не обмежується числом.

перетворити його в int змінити рядок на:

dots = parseInt(document.getElementById("txt").value, 10);

Примітка. 10Тут вказується десятковий (базовий-10). Без цього деякі браузери можуть не правильно інтерпретувати рядок. Див MDN: parseInt.

найпростіший:

dots = dots*1+5;

точки будуть перетворені в число.

НЕ ЗАБУДУЙТЕ - Використовуйте, parseFloat();якщо ви маєте справу з десятковою комою.

Я додаю цю відповідь, тому що я її тут не бачу.

Один із способів - поставити символ "+" перед значенням

приклад:

var x = +'11.5' + +'3.5'

x === 15

Я вважав, що це найпростіший спосіб

У цьому випадку рядок:

dots = document.getElementById("txt").value;

може бути змінено на

dots = +(document.getElementById("txt").value);

змусити його до числа

ПРИМІТКА:

+'' === 0
+[] === 0
+[5] === 5
+['5'] === 5

parseInt() повинен зробити трюк

var number = "25";
var sum = parseInt(number, 10) + 10;
var pin = number + 10;

Дає тобі

sum == 35
pin == "2510"

http://www.w3schools.com/jsref/jsref_parseint.asp

Примітка: 10в parseInt(number, 10)спеціфіціруешь десяткове (підстава-10). Без цього деякі браузери можуть не правильно інтерпретувати рядок. Див MDN: parseInt.

Це також працює для вас:

dots -= -5;

це дійсно просто

var total = (1 * yourFirstVariablehere) + (1 * yourSecondVariablehere)

це змушує javascript розмножуватися, тому що для * входу в JavaScript немає плутанини.

Ви можете додати + за змінною, і це змусить її бути цілим числом

var dots = 5
    function increase(){
        dots = +dots + 5;
    }

Спробувавши більшість відповідей тут без успіху для мого конкретного випадку, я придумав таке:

dots = -(-dots - 5);

Знаки + - це те, що плутає js, і це повністю їх усуває. Простий у здійсненні, якщо це потенційно незрозуміло.

ОНОВЛЕНО з моменту останнього зволікання ....

Я бачив лише порцію

var dots = 5
function increase(){
    dots = dots+5;
}

раніше, але пізніше мені було показано, що txtполе подає змінну dots. Через це вам потрібно буде обов’язково "очистити" вхід, щоб бути впевненим, що він має лише цілі числа, а не шкідливий код.

Один з простих способів зробити це - розібрати текстове поле з onkeyup()подією, щоб переконатися, що в ньому є цифрові символи:

<input size="40" id="txt" value="Write a character here!" onkeyup="GetChar (event);"/>

де подія дасть помилку та очистить останній символ, якщо значення не є числом:

<script type="text/javascript">
    function GetChar (event){
        var keyCode = ('which' in event) ? event.which : event.keyCode;
        var yourChar = String.fromCharCode();
        if (yourChar != "0" &&
            yourChar != "1" &&
            yourChar != "2" &&
            yourChar != "3" && 
            yourChar != "4" &&
            yourChar != "5" &&
            yourChar != "6" && 
            yourChar != "7" &&
            yourChar != "8" && 
            yourChar != "9")
        {
            alert ('The character was not a number');
            var source = event.target || event.srcElement;
            source.value = source.value.substring(0,source.value-2);
        }
    }
</script>

Очевидно, ви могли це зробити і з регулярним виразом, але я ледачий вихід вийшов.

Відтоді ви знаєте, що у вікні можуть бути лише цифри, ви зможете просто використовувати eval():

dots = eval(dots) + 5;