表单里取用户输入,后面带了单位,比如 42px,想拿纯数字怎么办。处理这种字符串,js parseint 是多数人的第一反应,它是 JS 里最常用的取整函数之一,也是踩坑最多的一批。
坑一:能解析到哪算哪
parseInt 从字符串开头逐字符解析,遇到不能转的字符就停。parseInt('42px') 返回 42,这很方便;但 parseInt('px42') 直接返回 NaN,因为第一个字符就不是数字。空字符串、null 传进去也是 NaN,往下用之前先用 Number.isNaN 判断一下。
坑二:第二个参数不传有历史遗留
老环境会把 0 开头的字符串当八进制处理,parseInt('010') 在旧浏览器里可能返回 8 而不是 10。ES5 之后默认按十进制解析,但保险起见,radix 永远手动传 10:parseInt('010', 10)。另外 0x 开头按十六进制算,parseInt('0x1f') 返回 31,这是规范行为,不是 bug。
坑三:只取整数,不做四舍五入
parseInt('3.99') 返回 3。要保留小数用 parseFloat 或 Number。顺带对比:Number('42px') 返回 NaN,而 parseInt 返回 42,一个整体校验、一个开头截取,场景不同选的工具不同。还有个小区别:parseInt 会忽略字符串前后的空格,Number 遇到纯空格返回 0,细节上别搞混。
还有个隐蔽问题:超过 2 的 53 次方的长数字,转成 Number 会丢精度。后端返回的雪花 ID 这类大数要用字符串保存,别拿 parseInt 去转,订单号对不上多半就是这个原因。
一句话收尾:js parseint 适合解析带单位的字符串数字,radix 传 10、结果判 NaN、大数不碰,记住这三条基本就安全了。