JS字符串转为数值方法详解

  在JS中,支持字符串类型和整数等数值类型互转;以下我们研究一下数据类型转换。

1 parseInt:字符串转为整数

1.1 基本用法

最简单的是将字符串直接转为十进制,此时parseInt()只需要传入一个参数即可。如下:

parseInt('123') // 123

当此时第一个字符为空格或者第一个为数字,其他的字符不能识别时,会自动去除空格以及不能被识别的字符,如下:

parseInt('   20') // 20
parseInt('8a') // 8
parseInt('12**') // 12
parseInt('12.34') // 12
parseInt('15e2') // 15
parseInt('15px') // 15

如果字符串的第一个字符不能转化为数字(后面跟着数字的正负号除外),返回NaN,如下:

parseInt('abc') // NaN
parseInt('.3') // NaN
parseInt('') // NaN
parseInt('+') // NaN
parseInt('+1') // 1

若字符串为带小数点的浮点数,或者直接为浮点数,则parseInt()只取整数部分进行转化,如下:

parseInt('1.99') // 1
parseInt(1.99)  // 1

如果字符串以0x或0X开头,parseInt会将其按照十六进制数解析。如果字符串以0开头,将其按照10进制解析。如下:

parseInt('0x10') // 16
parseInt('011') // 11

1.2 进制转换

  parseInt 方法还可以接受第二个参数(2到36之间),表示被解析的值的进制,返回该值对应的十进制数。默认情况下,parseInt 的第二个参数为10,即默认是十进制转十进制。如下:

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

//转换指定进制数。
parseInt('1000', 2) // 8
parseInt('1000', 6) // 216
parseInt('1000', 8) // 512

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

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

以上“5”对于二进制来说是无意义字符,故而第一个返回 ‘1’,第二个返回’NaN’。
还有一个有趣的现象,如果parseInt 的第一个参数不是字符串,会被先转为字符串。如下:

parseInt(0x11, 36) // 43
parseInt(0x11, 2) // 1

// 等同于
parseInt(String(0x11), 36)
parseInt(String(0x11), 2)

// 等同于
parseInt('17', 36)
parseInt('17', 2)

此时若第一个字符为0后面跟着有效字符,那么会被当做八进制数转化,要注意这个点。

2. parseFloat:字符串转为浮点数

parseFloat方法用于将一个字符串转为浮点数。

parseFloat('3.14') // 3.14

如果字符串符合科学计数法,则会进行相应的转换。如下:

parseFloat('314e-2') // 3.14
parseFloat('0.0314E+2') // 3.14

与parseInt类似,如果字符串包含不能转为浮点数的字符,则不再进行往后转换,返回已经转好的部分,如果参数不是字符串,或者字符串的第一个字符不能转化为浮点数,则返回NaN。如下:

parseFloat('3.14more non-digit characters') // 3.14
parseFloat('FF2') // NaN
parseFloat('') // NaN

3. Number:数值转换

Number() 方法可以可识别的字符串直接转化为数值,当字符串内是整数则被转化为整数,是浮点数则被转化为浮点数,若出现不可识别的字符,则直接被转为NaN*。如下:

Number("0x55") // 85
Number("55") // 55
Number("55.5") // 55.5
Number("55a") // NaN

Number() 方法会将空字符串转为0,而parseFloat会将空字符串转为NaN。
这些特点使得Number函数的转换结果不同于parseFloat。如下:

parseFloat(true)  // NaN
Number(true) // 1

parseFloat(null) // NaN
Number(null) // 0

parseFloat('') // NaN
Number('') // 0

4. 总结

  从以上我们可以看出,parseIntparseFloat 以及Number的返回值只有两种可能,要么是数值,要么是 NaN,而对于不能识别的情况会自动截取或者返回NaN,此三种方法一般可以看情况选用。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值