在前端开发中，我们经常需要处理数字类型的数据，但是由于 JavaScript 中只有一种 Number 类型，使得在处理具体数据时可能会遇到一些问题。例如，不同的字符串赋值给 Number 类型时，可能需要使用不同的转换方法，而不同方法之间可能存在着差异。因此，在 ES8 中，新增了两个方法：Number.parseInt 和 Number.parseFloat，来解决这些问题。
Number.parseInt
Number.parseInt 方法与原有的全局 parseInt 方法类似，用于将字符串解析成整数类型，但是有一些不同之处。
使用方法
Number.parseInt 方法接受两个参数，第一个参数是需要转换的字符串，第二个参数是表示进制的参数。
Number.parseInt(string, radix);
参数说明
- string: 需要转换的字符串。
- radix: 表示进制的参数。可选参数，范围为 2 ~ 36，默认为 10。
示例代码
Number.parseInt("10"); // 10
Number.parseInt("10.23"); // 10
Number.parseInt("0x10"); // 16
Number.parseInt("10", 2); // 2案例说明
在上面的代码中，当我们传入字符串 "10" 时，返回的结果为 10，这个我们都知道。但是，当我们传入 "10.23" 时，你会发现返回的结果还是 10，这说明 Number.parseInt 在转换时会自动忽略小数部分。
当需要转换 16 进制数时，我们可以直接传入字符串 "0x10"，Number.parseInt 方法会自动识别为 16 进制的数进行转换。
当我们需要将二进制数字符串 "10" 转换成十进制数时，可以通过第二个参数指定进制为 2。
Number.parseFloat
Number.parseFloat 方法与原有的全局 parseFloat 方法类似，用于将数字字符串解析成浮点数类型，但是有一些不同之处。
使用方法
Number.parseFloat 方法接受一个参数，即需要转换的字符串。
Number.parseFloat(string);
参数说明
- string: 需要转换的字符串。
示例代码
Number.parseFloat("10"); // 10
Number.parseFloat("10.23"); // 10.23
Number.parseFloat("0x10"); // 0 (无法转换)案例说明
在上面的代码中，传入字符串 "10" 进行转换时，返回结果为 10，与全局 parseFloat 方法的结果相同。
当我们传入字符串 "10.23" 时，Number.parseFloat 方法会将其转换为浮点数 10.23，并返回该结果。
但是当我们传入字符串 "0x10" 时，Number.parseFloat 方法无法正确转换该字符串，返回结果为 0。
总结
在前端开发中，我们经常需要处理数字类型的数据。尤其在使用 AJAX 交互时，会接收到原始数据，需要我们进行一些类型转换。在 ES8 中，Number.parseInt 和 Number.parseFloat 方法可以帮助我们更容易地转换字符串类型的数字数据，它们的引入解决了 JavaScript 数值类型问题。通过本文的介绍和示例，相信对于前端开发者们处理数值类型数据时会更加得心应手。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65a0cbdcadd4f0e0ff900fdc