返回

不容错过的 JS 字符串转数字三种神奇转换法!

前端

在 JS 开发中,字符串与数字类型转换是家常便饭。理解并掌握字符串转数字的三种方法——转换函数、强制类型转换和弱类型转换——将使你轻松驾驭数据世界。

1. 转换函数:解析数字内容,轻松搞定!

转换函数,顾名思义,就是将一种数据类型转换为另一种数据类型。其中,parseInt() 和 parseFloat() 两个函数专门负责将字符串转换为数字。

parseInt():

parseInt() 函数可将字符串中的数字内容解析为整数。语法为:parseInt(string, radix),其中 string 是要转换的字符串,radix 是转换时使用的进制,默认值为 10。

例如:

const num1 = parseInt("100"); // 结果为 100
const num2 = parseInt("0b11001", 2); // 结果为 25
const num3 = parseInt("0xFF", 16); // 结果为 255

parseFloat():

parseFloat() 函数可将字符串中的数字内容解析为浮点数。语法为:parseFloat(string),其中 string 是要转换的字符串。

例如:

const num1 = parseFloat("10.5"); // 结果为 10.5
const num2 = parseFloat("0.1234e2"); // 结果为 12.34
const num3 = parseFloat("1.23456789"); // 结果为 1.23456789

2. 强制类型转换:一锤定音,数字即刻诞生!

强制类型转换,是指使用一种数据类型的构造函数将另一种数据类型强制转换为该数据类型。字符串转数字的强制类型转换使用 Number() 构造函数。

语法为:Number(value),其中 value 是要转换的值。

例如:

const num1 = Number("100"); // 结果为 100
const num2 = Number("0b11001"); // 结果为 25
const num3 = Number("0xFF"); // 结果为 255
const num4 = Number("10.5"); // 结果为 10.5
const num5 = Number("0.1234e2"); // 结果为 12.34
const num6 = Number("1.23456789"); // 结果为 1.23456789

强制类型转换的好处是,它可以将任何类型的值转换为数字。但是,如果要转换的值不是有效的数字,则会返回 NaN(非数字)。

3. 弱类型转换:隐式转换,数字自然生成!

弱类型转换,是指在某些情况下,JS 会自动将一种数据类型转换为另一种数据类型。字符串转数字的弱类型转换发生在数学运算中。

例如:

const num1 = "100" + 1; // 结果为 101(字符串与数字相加,结果为字符串)
const num2 = "100" - 1; // 结果为 99(字符串与数字相减,结果为数字)
const num3 = "100" * 2; // 结果为 200(字符串与数字相乘,结果为数字)
const num4 = "100" / 2; // 结果为 50(字符串与数字相除,结果为数字)

弱类型转换的好处是,它无需显式转换,即可将字符串转换为数字。但是,如果要转换的值不是有效的数字,则会返回 NaN(非数字)。

总结

字符串转数字的三种方法各有千秋。转换函数可解析数字内容、保留小数点、科学计数法轻松搞定;强制类型转换一锤定音,数字即刻诞生;弱类型转换隐式转换,数字自然生成。根据实际需要选择合适的方法,让数据转换之旅更加轻松高效!