JavaScript parseInt 与 parseFloat 用法详解

parseInt()

依据指定基数(参数 radix 的值)，把字符串(参数 string 的值)解析成整数。这个方法和 Number.parseInt() 函数具有一样的函数功能。

Number.parseInt === parseInt; // true

语法：parseInt(string, radix)

string：要被解析的值。如果参数不是一个字符串，则将其转换为字符串(使用 toString)。字符串开头的空白符将会被忽略。
radix：
- 一个介于 2 和 36 之间的整数(数学系统的基础)，表示上述字符串的基数。比如参数 10 表示使用十进制数值系统，超出这个范围，则返回 NaN
- 如果第二个参数是 0、undefined 和 null，则直接忽略。
- 在基数为 undefined，或者基数为 0 或者没有指定的情况下，JavaScript 作如下处理：
  - 如果字符串 string 以"0x"或者"0X"开头, 则基数是 16 (16进制).如果字符串 string 以"0"开头, 基数是 8（八进制）或者 10（十进制），那么具体是哪个基数由实现环境决定。ECMAScript 5 规定使用 10，但是并不是所有的浏览器都遵循这个规定
- 如果字符串 string 以其它任何值开头，则基数是 10 (十进制)。
  1. 忽略字符串前面的空格，直至找到第一个非空字符
  2. 如果第一个字符不是数字符号或者负号，返回 NaN
  3. 如果第一个字符是数字，则继续解析直至字符串解析完毕或者遇到一个非数字符号为止
  4. 如果上步解析的结果以 0 开头，则将其当作八进制来解析；如果以 0x 开头，则将其当作十六进制来解析
  5. 如果指定 radix 参数，则以 radix 为基数进行解析
  6. 如果 parseInt 的参数不是字符串，则会先转为字符串再转换。
  7. 字符串转为整数的时候，是一个个字符依次转换，如果遇到不能转为数字的字符，就不再进行下去，返回已经转好的部分。

返回值：返回解析后的整数值。如果被解析参数的第一个字符无法被转化成数值类型，则返回 NaN。

一些数中可能包含 e 字符（例如 6.022e23），使用 parseInt 去截取包含 e 字符数值部分会造成难以预料的结果。例如：

parseInt('6.022e23', 10); // 返回 6
parseInt(6.022e2, 10); // 返回 602
// 以下例子均返回15:
parseInt('0xF', 16);
parseInt('F', 16);
parseInt('17', 8);
parseInt(021, 8);
parseInt('015', 10);
parseInt(15.99, 10);
parseInt('15,123', 10);
parseInt('FXX123', 16);
parseInt('1111', 2);
parseInt('15 * 3', 10);
parseInt('15e2', 10);
parseInt('15px', 10);
parseInt('12', 13);

如果字符串的第一个字符不能转化为数字（后面跟着数字的正负号除外），返回 NaN。

示例

// 以下例子均返回 NaN:
parseInt('Hello', 8); // 根本就不是数值
parseInt('546', 2); // 除了“0、1”外，其它数字都不是有效二进制数字

// 以下例子均返回 -15：
parseInt('-F', 16);
parseInt('-0F', 16);
parseInt('-0XF', 16);
parseInt(-15.1, 10);
parseInt(' -17', 8);
parseInt(' -15', 10);
parseInt('-1111', 2);
parseInt('-15e1', 10);
parseInt('-12', 13);

// 下例中全部返回 4:
parseInt(4.7, 10);
parseInt(4.7 * 1e22, 10); // 非常大的数值变成 4
parseInt(0.00000000000434, 10); // 非常小的数值变成 4

// 下面的例子返回 224
parseInt('0e0', 16);

parseInt(); // NaN
parseInt(''); // NaN
parseInt('+'); // NaN

对于那些会自动转为科学计数法的数字，parseInt 会将科学计数法的表示方法视为字符串，因此导致一些奇怪的结果。

parseInt(1000000000000000000000.5); // 1
// 等同于
parseInt('1e+21'); // 1

parseInt(0.0000008); // 8
// 等同于
parseInt('8e-7'); // 8

进制转换示例

parseInt('1000'); // 1000
// 等同于
parseInt('1000', 10); // 1000

parseInt('1000', 2); // 8
parseInt('1000', 6); // 216
parseInt('1000', 8); // 512

parseInt('10', 37); // NaN
parseInt('10', 1); // NaN
parseInt('10', 0); // 10
parseInt('10', null); // 10
parseInt('10', undefined); // 10

如果字符串包含对于指定进制无意义的字符，则从最高位开始，只返回可以转换的数值。如果最高位无法转换，则直接返回 NaN。

对于二进制来说，1 是有意义的字符，5、4、6 都是无意义的字符，所以第一行返回 1，第二行返回 NaN。

parseInt('1546', 2); // 1
parseInt('546', 2); // NaN

parseFloat()

可以把一个字符串解析成浮点数。该方法与 Number.parseFloat() 函数相同。解析一个参数（必要时先转换为字符串）并返回一个浮点数。

返回值：给定值被解析成浮点数。如果给定值不能被转换成数值，则会返回 NaN。

如果 parseFloat 在解析过程中遇到了正号（+）、负号（-）、数字（0-9）、小数点（.）、或者科学记数法中的指数（e 或 E）以外的字符，则它会忽略该字符以及之后的所有字符，返回当前已经解析到的浮点数。
第二个小数点的出现也会使解析停止（在这之前的字符都会被解析）。
参数首位和末位的空白符会被忽略('\t\v\r3.14\n ')。
如果参数字符串的第一个字符不能被解析成为数字,则 parseFloat 返回 NaN。
parseFloat 也可以解析并返回 Infinity。
parseFloat 解析 BigInt 为 Numbers, 丢失精度。因为末位 n 字符被丢弃。
parseFloat 也可以转换一个已经定义了 toString 或者 valueOf 方法的对象，它返回的值和在调用该方法的结果上调用 parseFloat 值相同。

// 下面的例子都返回3.14
parseFloat(3.14);
parseFloat('3.14');
parseFloat('  3.14  ');
parseFloat('314e-2');
parseFloat('0.0314E+2');
parseFloat('3.14some non-digit characters');
parseFloat({
  toString: function () {
    return '3.14';
  },
});
parseFloat('\t\v\r3.14\n ');
parseFloat([3.14]);
parseFloat(String([3.14]));

// 返回NaN
parseFloat('FF2');
parseFloat('');
parseFloat();
parseFloat([]);
parseFloat(true);
parseFloat(null);

// 返回 900719925474099300，当整数太大以至于不能被转换时将失去精度。
parseFloat(900719925474099267n);
parseFloat('900719925474099267n');