在Javascript中添加两个变量[重复]答案

【问题标题】：Adding two variables in Javascript [duplicate]在Javascript中添加两个变量[重复]
【发布时间】：2019-02-28 03:49:44
【问题描述】：

我想输入一个数字 (id="number") 并将其保存为“x”。然后创建另一个变量“y”，即“x”的 5%。然后我想将它们加在一起并将结果保存在一个名为“result”的变量中。假设 x = 100。然后 y = 5。如果我只是提醒“y”，它会提醒数字 5，这是正确的，但问题是当我尝试提醒“结果”（x+y）时，它会提醒 1005 （它不会添加数字，只是将它们彼此相邻写）。

let x = document.getElementById("number");
let y = x*0.05;
var result = x+y;
alert(result);

【问题讨论】：

document.getElementById("number");会给你一个元素，你需要使用.value获取它的值，如果它和输入或用户.textContent如果它里面有文本 - 你还需要在检索到输入后将字符串转换为int跨度>
这听起来像是在进行字符串连接，而不是加法。我会搜索如何修复。

标签： javascript add

【解决方案1】：

先获取value，然后将其转换为number：

改变：

var x = document.getElementById("number")

到：

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

注意：即使type 属性与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>

【讨论】：

【解决方案2】：

你需要一个值来进行一些计算。所以，

var x = document.getElementById("number").value;
如果字符串值存在，
“+”运算符将连接。 var x 是字符串值，但是当 var y=x*0.05 时会发生自动类型转换。所以你必须通过 parseInt() 明确声明“x 是数字”。

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

现在“+”运算符将按预期工作。

【讨论】：

【解决方案3】：

发生了什么是 x+y 正在执行 string concatenation，而不是整数加法——这正是你想要的。

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

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

这就是问题所在，但解决方案是什么？

解决方案是将force integer addition 与parseInt() 类似（如Ehsan mentioned）

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

值得注意的是，Ehsan 使用 document.getElementById("number").value，而不是 document.getElementById("number")

这会强制 x 为 int，这将允许 x+y 执行整数加法。

附：我还应该指出，您的问题的部分原因与 document.getElementById("number").value 是一个字符串这一事实有关，从而迫使 type conversion 发生

加号“+”连接字符串几乎所有的数学运算都将值转换为数字。一个值得注意的例外是加法+。如果添加的值之一是字符串，则另一个也转换为字符串。

然后，它连接（连接）它们：
alert( 1 + '2' ); // '12' (string to the right)
alert( '1' + 2 ); // '12' (string to the left)
仅当至少一个参数是字符串时才会发生这种情况。否则，值将转换为数字。

意味着加法运算中的一个操作数（同样，document.getElementById("number").value 是一个字符串）是一个字符串，这会强制两者都成为字符串并连接起来。

【讨论】：