Javascript/jQuery 给出奇怪的加法结果

Question

我刚开始 javascript 和 jquery，现在我遇到了这样的问题：

var myCharacter = ('#myCharacter').css('top'); // gives 140px
var numberOnly = myCharacter.replace('px',''); // gives 140
var total = numberOnly + 20; // gives 14020 not 160

我只是不明白为什么会这样。

Answer 1

你需要parseInt()

var total = parseInt(numberOnly) + 20;

因为 numberOnly 是一个字符串，而不是一个数字，所以它向一个字符串添加一个数字，结果是 14020 作为一个字符串

Answer 2

numberOnly 仍然是 string 类型，即它是一些字符。因此，您当前将字符串 '140' 与 20 连接，它被隐式转换为字符串。

要解决此问题，请使用 [parseInt][1] 将 numberOnly 转换为整数。

Answer 3

那是因为 numberOnly 是一个 String，您可以通过以下方式转换为 int：

var total = +numberOnly + 20

Answer 4

var myCharacter = ('#myCharacter').css('top'); // gives 140px
var numberOnly = myCharacter.replace('px',''); // gives 140
var total = parseInt(numberOnly) + 20;

Answer 5

当你替换'140px'中的'px'时，你最终得到一个字符串类型的变量。（javascript 有类型，但它们是动态的）

当你调用 '140'+20 时，类型不会自动转换，因为 + 是一个对字符串有意义的操作：连接。

您应该显式转换为数字，例如使用 parseInt('140')，然后加法应该会按预期工作。

Answer 6

您正在尝试用字符串相加，因此首先将其转换为整数，使用 parseInt() 执行此操作：

var total = parseInt(numberOnly) + 20;//160

Answer 7

由于 numberOnly + 20 中的操作数之一是字符串，因此 + 运算符执行字符串连接，而不是加法。

使用parseInt方法将字符串解析为数字，那么px部分也不用去掉，遇到非数字字符就结束解析。

var myCharacter = parseInt(('#myCharacter').css('top'), 10);
var total = myCharacter + 20;

Javascript/jQuery 给出奇怪的加法结果

Javascript/jQuery gives weird result from addition

javascript

jquery

addition