parseInt按指定进制提取整数,遇非数字字符停止;parseFloat仅十进制解析浮点数,支持小数点和科学计数法,两者均忽略前导空格、截断尾部无效字符,但parseInt需显式radix防兼容问题,parseFloat更适用于带小数的场景。

parseInt 和 parseFloat 是 JavaScript 中用于从字符串中提取数字的两个常用函数,但它们的行为和适用场景有明显区别。理解它们如何解析字符串,能避免常见陷阱,比如意外截断、进制混淆或 NaN 返回。
parseInt:按指定进制提取整数,遇到非数字字符就停止
parseInt 会从字符串开头开始读取,跳过前导空格,然后尝试按指定进制(默认十进制)解析整数部分,直到遇到无法识别为该进制数字的字符为止,后续内容全部忽略。
- 必须传入第二个参数(radix),否则在某些字符串下可能被误判为八进制(如 "012" → 10),ES5+ 虽已规范默认为 10,但显式写
parseInt(str, 10)更安全 - 支持十六进制(radix=16):如
parseInt("0xFF", 16)→ 255;parseInt("FF", 16)→ 255 - 不识别小数点:如
parseInt("3.14")→ 3;parseInt("3.99")→ 3 - 开头非有效数字直接返回 NaN:如
parseInt("abc123")→ NaN;但parseInt(" 42px")→ 42(跳过空格后成功)
parseFloat:只按十进制解析浮点数,支持小数和科学计数法
parseFloat 始终以十进制解析,目标是提取一个尽可能长的有效浮点数,支持小数点、正负号和 e/E 形式的指数记法,同样从开头跳过空格,遇到非法字符即停止。
- 不接受 radix 参数,也不支持其他进制
- 能正确处理小数:
parseFloat("3.1415")→ 3.1415;parseFloat(" -2.5e3")→ -2500 - 对混合字符串较“宽容”:
parseFloat("123.45abc")→ 123.45;parseFloat(" 0x1A")→ 0(因为 "0x" 不是合法浮点开头,只认 "0") - 开头无效则返回 NaN:
parseFloat("xyz789")→ NaN;但parseFloat(" +.5")→ 0.5(支持省略整数位)
与 Number() 和一元加号的区别
Number("123.45") 或 +"123.45" 要求字符串**整体**可转为有效数字,不允许尾部多余字符,否则直接返回 NaN;而 parseInt/parseFloat 是“宽松提取”,只要开头合法就返回部分结果。
-
Number("123abc")→ NaN;parseInt("123abc")→ 123 -
+"3.14px"→ NaN;parseFloat("3.14px")→ 3.14 - 若需严格校验整个字符串是否为纯数字,优先用 Number() 或正则配合 isNaN()
实用建议:什么情况用哪个?
- 提取 CSS 值中的像素数(如 "24px")、用户输入的整数 ID、带单位的计数——用
parseInt(str, 10) - 解析带小数的价格、坐标、尺寸(如 "12.5rem"、"-3.14e-2%")——用
parseFloat(str) - 不确定输入格式但要求“全字符串匹配”——改用
Number(str),并检查是否为有限数字:!isNaN(num) && isFinite(num) - 避免隐式转换:不要依赖
if (str)或str * 1做数字提取,语义不清且易出错
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











