Adding two variables in Javascript [duplicate]

Fist get value and so convert it to number:

Change :

var x = document.getElementById("number")

to :

var x = parseInt( document.getElementById("number").value )

Note : You must convert the input to a number even if type property be equal with number.

function fun() {
  var x = document.getElementById('number').value;
  console.log( typeof x)
  var y = parseInt(document.getElementById('number').value);
  console.log( typeof y)
}

<input type="number" id="number">
<button onclick="fun()">Go..</button>

1. you need a value for doing some calculation. so,

   var x = document.getElementById("number").value;

2. "+" operator will concatenate if string value exist. var x is string value but automatic type casting will occur when var y=x*0.05. so you must cleary declaire "x is number" via parseInt().

   var x = parseInt(document.getElementById("number").value);

Now "+" operator will work as you expected.

What's going on is x+y is performing string concatenation, not integer addition--which is what you want.

// String concatenation
console.log("100" + "5"); // outputs "1005"

// Integer Addition
console.log(100 + 5); // outputs "105"

That's the problem, but what's the solution?

The solution is to force integer addition with something like parseInt() (as Ehsan mentioned)

var x = parseInt( document.getElementById("number").value );

Worth noting is the fact that Ehsan uses document.getElementById("number").value, instead of document.getElementById("number")

This forces x to be an int, which will allow x+y to perform integer addition.

P.S. I should also note part of the reason for your problem is related to the fact that document.getElementById("number").value is a string, forcing a type conversion to take place

Addition ‘+’ concatenates strings Almost all mathematical operations convert values to numbers. A notable exception is addition +. If one of the added values is a string, the other one is also converted to a string.

Then, it concatenates (joins) them:

alert( 1 + '2' ); // '12' (string to the right)
alert( '1' + 2 ); // '12' (string to the left)

This only happens when at least one of the arguments is a string. Otherwise, values are converted to numbers.

Meaning that one of the operands (again, document.getElementById("number").value is a string) in an addition operation being a string forces both to become strings and get concatenated.