在前端开发中，我们经常需要将字符串转换成数字。在 ECMAScript 2020 中，新增了自动转换的功能，使得转换更加方便快捷。本文将介绍 ECMAScript 2020 中的自动转换功能，并提供示例代码和实用技巧。
Number.parseInt()
在 ECMAScript 2020 中，我们可以使用 Number.parseInt() 方法将字符串转换成整数。该方法的语法如下：
Number.parseInt(string[, radix])
其中，string 表示要转换的字符串，radix 表示进制数。如果省略 radix 参数，则默认为 10。
下面是一些示例代码：
Number.parseInt('123') // 123
Number.parseInt('123', 10) // 123
Number.parseInt('010') // 10
Number.parseInt('0x10') // 16
Number.parseInt('0b10') // 2在上面的示例代码中，我们可以看到：
- 第一个示例中，将字符串 '123' 转换成了整数 123。
- 第二个示例中，将字符串 '123' 转换成了整数 123，同时指定了进制数为 10。
- 第三个示例中，将字符串 '010' 转换成了整数 10。由于省略了 radix 参数，则默认为 10。
- 第四个示例中，将字符串 '0x10' 转换成了整数 16。由于指定了进制数为 16，因此可以正确地将其转换成整数。
- 第五个示例中，将字符串 '0b10' 转换成了整数 2。由于指定了进制数为 2，因此可以正确地将其转换成整数。
Number.parseFloat()
除了 Number.parseInt() 方法之外，ECMAScript 2020 还提供了 Number.parseFloat() 方法，用于将字符串转换成浮点数。该方法的语法如下：
Number.parseFloat(string)
其中，string 表示要转换的字符串。
下面是一些示例代码：
Number.parseFloat('3.14') // 3.14
Number.parseFloat('314e-2') // 3.14
Number.parseFloat('0.0314E+2') // 3.14在上面的示例代码中，我们可以看到：
- 第一个示例中，将字符串 '3.14' 转换成了浮点数 3.14。
- 第二个示例中，将字符串 '314e-2' 转换成了浮点数 3.14。由于字符串中包含了科学计数法，因此可以正确地将其转换成浮点数。
- 第三个示例中，将字符串 '0.0314E+2' 转换成了浮点数 3.14。由于字符串中包含了科学计数法，因此可以正确地将其转换成浮点数。
实用技巧
在实际开发中，我们经常需要对用户输入的数据进行校验。一种常见的校验方式是判断输入的字符串是否可以转换成数字。在 ECMAScript 2020 中，我们可以使用自动转换的功能来实现这个校验过程。
下面是一个示例代码：
function isNumber(str) {
return !isNaN(Number.parseInt(str)) || !isNaN(Number.parseFloat(str))
}
console.log(isNumber('123')) // true
console.log(isNumber('3.14')) // true
console.log(isNumber('abc')) // false在上面的示例代码中，我们定义了一个 isNumber() 函数，该函数接受一个字符串作为参数，并返回一个布尔值，表示该字符串是否可以转换成数字。具体实现方式是使用 Number.parseInt() 和 Number.parseFloat() 方法来尝试转换字符串，如果转换成功则返回 true，否则返回 false。
在实际开发中，我们可以利用这个函数来校验用户输入的数据是否合法，从而提高应用程序的健壮性和安全性。
总结
ECMAScript 2020 中的自动转换功能为前端开发带来了更加便捷和高效的转换方式。本文介绍了 Number.parseInt() 和 Number.parseFloat() 方法的用法和示例代码，并提供了实用技巧，希望能够对读者有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6579ea6fd2f5e1655d41625b