parseInt() 函数的奇怪行为

Posted 2023-04-13

参考技术A

parseInt() 是一个内置的 javascript 函数，用于从数字字符串中解析整数。 例如，让我们从数字字符串 \'100\' 中解析整数：

正如预期的那样，\'100\' 被解析为整数 100。
parseInt(numericalString, radix) 还接受第二个参数：数字字符串参数所在的基数。 radix 参数允许我们解析不同数字基数的整数，最常见的是 2、8、10 和 16。
让我们使用 parseInt() 来解析基数为 2 的数字字符串：

parseInt(\'100\', 2) 将 \'100\' 解析为基数为 2 的整数：因此它返回值 4（十进制）。

parseInt(numericalString) 总是将其第一个参数转换为字符串（如果它不是字符串），然后将该数字字符串解析为整数值。

这就是为什么我们可以（但不应该！）使用parseInt() 来提取浮点数的整数部分的原因：

提取浮点数的整数部分，如 0.5、0.05 等，结果为 0。这一切正常。

但是如果提取 0.0000005 的整数部分怎么样？

parseInt() 将浮点数 0.0000005 解析为... 5. 有趣且有点出乎意料...

为什么 parseInt(0.0000005) 有这么奇怪的行为？

让我们再看看 parseInt(numericalString) 对它的第一个参数做了什么：如果它不是字符串，则将其转换为字符串，然后进行解析，并返回解析后的整数。

这是第一个线索。

然后让我们尝试手动将浮点数转换为字符串表示：

显式转换为 String(0.0000005) 字符串的 结果与其他浮点数不同：它是指数计数法的字符串！

这是第二个——也是一个重要的线索！

当指数计数法字符串被解析为一个整数时，我们会得到数字 5：

parseInt(\'5e-7\') 只处理第一个数字 \'5\'，但忽略\'e-7\'。

谜团已揭开！ 因为 parseInt() 总是将其第一个参数转换为字符串，所以小于10 ^-6 的浮点数以指数表示法写入。 然后 parseInt() 从浮点数的指数符号中提取整数。

附带说明一下，为了安全地提取浮点数的整数部分，推荐 Math.floor() 函数：

parseInt() 是将数字字符串解析为整数的函数。
尝试使用 parseInt() 提取浮点数的整数部分时必须小心。
小于10 ^-6 的浮点数会转换为以指数表示法的字符串（例如 5e-7 是 0.0000005 的指数表示法），而且只转换数字部分，这就是为什么在 parseInt() 中转换小浮点数会导致意外结果的原因。
附带挑战：你能解释一下为什么 parseInt(9999999999999999999999) 等于 1 吗？

#yyds干货盘点#parseInt怪异行为

​​parseInt()​​是内置的 JS 函数，用于解析数字字符串中的整数。 例如，解析数字字符串​​100​​：

const number = parseInt(100);
number; // 100

如预期的那样，​​100​​​被解析为整数 ​​100​​。

​​parseInt(numericalString, radix)​​还接受第二个参数：从 2 到 36，表示字符串的基数。例如指定 16 表示被解析值是十六进制数。请注意，10 不是默认值，最常见的是 2、8、10 和 16。

例如我们使用 ​​parseInt​​ 以二进制方式解析数字字符串：

const number = parseInt(100, 2);
number; // 4

100 对应的二进制数是 4，所以返回 4。

​

parseInt() 的怪异行为

​​parseInt(numericalString)​​始终将其第一个参数转换为字符串（如果不是字符串），然后将该数字字符串解析为整数值。

这就是为什么你可以（但不应该）使用​​parseInt()​​提取浮点数的整数部分的原因：

parseInt(0.5);      // => 0
parseInt(0.05);     // => 0
parseInt(0.005);    // => 0
parseInt(0.0005);   // => 0
parseInt(0.00005);  // => 0
parseInt(0.000005); // => 0

提取浮点数的整数部分，如​​0.5​​​、​​0.05​​​等，结果为​​0​​, 这和预期的一样。

那提取​​0.0000005​​的整数部分怎么样？

parseInt(0.0000005); // => 5

​​parseInt()​​ 将浮点数 ​​0.0000005​​ 解析为 ​​5​​。为什么 ​​parseInt(0.0000005)​​ 有这样一个怪异的行为？

​

解决parseInt()怪异行为

我们再看一看 ​​parseInt(numericalString)​​ 的第一个参数：如果它不是字符串，则将其转换为字符串，然后解析，并返回解析后的整数。

这可能是第一个线索。

然后，我们尝试将浮点数手动转换为字符串表示形式：

String(0.5);      // => 0.5
String(0.05);     // => 0.05
String(0.005);    // => 0.005
String(0.0005);   // => 0.0005 
String(0.00005);  // => 0.00005
String(0.000005); // => 0.000005

String(0.0000005); // => 5e-7

显式转换为​​string(0.0000005)​​字符串的行为与其他浮点数不同:它的表示方式是用指数的形式。

这是第二个重要的线索！

当指数符号被解析为整数时，我们会得到数字5。

parseInt(0.0000005); // => 5
// same as
parseInt(5e-7);      // => 5
// same as
parseInt(5e-7);    // => 5

​​parseInt(5e-7)​​​考虑第一个数字​​5​​​，但跳过​​e-7​​。

谜团已揭开！ 因为 ​​parseInt()​​ 始终将其第一个参数转换为字符串，所以小于​​10负6次方​​的浮点数将以指数表示。 然后 ​​parseInt()​​ 从 float 的指数表示法中提取整数。

另外，为了安全地提取浮点数的整数部分，建议使用 ​​Math.floor()​​ 函数：

Math.floor(0.5);      // => 0
Math.floor(0.05);     // => 0
Math.floor(0.005);    // => 0
Math.floor(0.0005);   // => 0
Math.floor(0.00005);  // => 0
Math.floor(0.000005); // => 0

Math.floor(0.0000005); // => 0

总结

​​parseInt()​​ 是将数字字符串解析为整数的函数。

尝试使用​​parseInt()​​提取浮点数的整数部分时必须小心。

小于10的-6次方 (例如0.0000005，也就是5*10-7)的浮点数转换成字符串时被写成指数表示法(例如5e-7是0.0000005的指数表示法)。这就是为什么在 ​​parseInt()​​ 中使用这么小的浮点数会导致意想不到的结果:只有指数表记的重要部分(例如 ​​5e-7​​ 中的 ​​5​​)会被解析。