何时使用parseInt函数

Question

当从DOM中提取数字并进行计算时，我需要遵循哪个规则？JavaScript如何知道一个值是数字还是其他类型？我是否应该始终使用parseInt？

给定以下代码：

HTML

<div id="myvalue">5</div>
<div id="withParseInt"></div>
<div id="withoutParseInt"></div>
<div id="withoutParseIntButIncrement"></div>

JS与jQuery:

var value = $('#myvalue').text();
$('#withParseInt').text(parseInt(value) + 1);
$('#withoutParseInt').text(value + 1);
$('#withoutParseIntButIncrement').text(value++);

输出如下：

5
6
51
5

Fiddle：http://jsfiddle.net/ytxKU/3/

- iappwebdev

Answer 1

.text() 方法总是返回一个字符串。一些运算符，比如 + 运算符被重载了用于执行算术和字符串操作。在字符串的情况下，它执行拼接，因此得到了 "51" 的结果。

如果你有一个字符串并需要使用一个不进行强制转换的运算符，你将不得不使用 parseInt（或其他一些将其转换为数字的方法）。

然而，例如乘法运算符 * 隐式地执行这个类型转换，因此在那种情况下就不需要使用 parseInt 调用（可以查看更新的样例代码）。

请注意，递增运算符 ++ 确实对其操作数进行强制转换，但你使用了后缀运算符，所以它不会产生任何效果。使用前缀运算符，你就可以看到它的作用：

$('#withoutParseIntButIncrement').text(++value);

因此，总结一下：

// Parses string to number and adds 1
$('#withParseInt').text(parseInt(value) + 1);

// Coerces number 1 to string "1" and concatenates
$('#withoutParseInt').text(value + 1);

// Implicity coerces string to number, but after it's been inserted into the DOM
$('#withoutParseIntButIncrement').text(value++);

// Implicity coerces string to number, before it's been inserted into the DOM
$('#withoutParseIntButIncrement').text(++value);

// Implicity coerces to number
$('#withoutParseIntButMultiply').text(value * 2);

顺带一提：始终将第二个参数（基数）传递给parseInt被认为是良好的实践。这可以确保以正确的进制解析数字：

---

parseInt(value, 10); // For base 10

- James Allardice

---

听起来很合理。有时候，当我从DOM中提取数字进行计算时，会遇到一些严重的问题，所以我一直在处理数字时使用parseInt。你的答案证实了这一点。这样我就更加安全了。 - iappwebdev

这个问题讲解了为什么在解析整数时应该总是提供一个基数，原因是一些奇怪的浏览器特性。https://dev59.com/gGgt5IYBdhLWcg3w0wzB?rq=1 - Matt Fletcher

Answer 2

唯一的规则：

从 DOM 中检索到的每个值都是字符串。

- Amberlamps

---

每一个你插入回DOM的值都会变成字符串。 - Álvaro González

Answer 3

是的，你应该总是使用parseInt()或Number()来保险起见。否则，Javascript将决定如何处理它。

• 值本身是一个字符串
• 使用运算符+会连接两个字符串
• 使用运算符-会计算数值差异
• ...

- devnull69

Answer 4

为了安全起见，始终最好使用parseInt，特别是因为您可以提供第二个参数来指定要使用的数字系统。

顺便说一下，在您的最后一个示例中，如果您希望其等于6，则应为++value。

- Matt Fletcher