Math.floor() 用法详解及实例演示

本文深入解析了 JavaScript 中 Math.floor() 方法的核心特性与常见误区，强调它并非简单“去掉小数”，而是严格向负无穷方向取整——这在处理负数时（如 Math.floor(-2.8) 返回 -3）与 Math.trunc()、parseInt() 等有本质区别；文章不仅厘清了边界行为（NaN、null、空字符串等隐式转换陷阱），还对比了适用场景，指出 Math.floor() 的真正价值在于分页计算、网格索引等需“向下对齐”的逻辑，而若只需截断小数，则应选用更精准的替代方案，帮助开发者避开高频坑点、写出更健壮可靠的代码。

Math.floor() 的基本行为和边界情况

Math.floor() 会向下取整，也就是返回小于或等于参数的最大整数。它不四舍五入，也不截断小数部分（比如 Math.trunc() 那样），而是“往负无穷方向”取整。

常见误解是认为它只是去掉小数，但负数时差别明显：Math.floor(-2.8) 返回 -3，不是 -2。这是因为 -3 ，而满足“不大于 -2.8 的最大整数”只有 -3。

• Math.floor(3.9) → 3
• Math.floor(-3.1) → -4
• Math.floor(0.0) → 0
• Math.floor(NaN) → NaN（注意：不报错，但结果不可用）

和 Math.trunc()、parseInt() 的关键区别

想“取整数部分”，很多人下意识写 parseInt() 或 Math.trunc()，但这和 Math.floor() 行为不同，尤其在负数和非数字输入时：

• parseInt("-3.7") 先转字符串再解析，遇到小数点就停，结果是 -3；而 Math.floor(-3.7) 是 -4
• Math.trunc(-3.7) 直接截掉小数，得 -3；Math.floor() 不是截断，是向下找整数
• parseInt("3.7px") 返回 3（容忍部分非数字字符），Math.floor("3.7px") 返回 NaN（强制要求可转为有效数字）

实际使用中容易踩的坑

多数问题出在类型隐式转换和边界值上：

• 传入空字符串 "" 或空白字符串 " "：会被转成 0，Math.floor("") → 0，可能掩盖数据缺失
• 传入 null：转成 0，Math.floor(null) → 0；传入 undefined → NaN
• 传入极大浮点数（如 1e308 * 2）可能溢出为 Infinity，Math.floor(Infinity) 还是 Infinity，但后续计算可能出错
• 涉及时间戳或坐标计算时，如果原始值是字符串（如 API 返回的 "123.45"），建议显式转 Number：Math.floor(Number(str))，避免 parseInt() 的进制陷阱

替代方案：需要“向零取整”时别硬套 Math.floor()

如果你其实想要的是“去掉小数部分”，比如把 -3.7 变成 -3，那 Math.floor() 就不对。这时候该用：

• Math.trunc(x)：最直接，ES6+ 支持，对正负数都截断小数
• x | 0：仅适用于安全整数范围（-2^31 ~ 2^31-1）内的数值，且会把小数直接丢弃（类似 Math.trunc）
• ~~x：双按位非，效果同 | 0，但可读性差，不推荐用于生产

真正需要 Math.floor() 的典型场景是分页计算（如 Math.floor((total - 1) / pageSize)）、网格布局索引、或者明确要求“向下对齐”的数值量化——这时候它的负数行为不是 bug，而是 feature。

今天关于《Math.floor() 用法详解及实例演示》的内容介绍就到此结束，如果有什么疑问或者建议，可以在golang学习网公众号下多多回复交流；文中若有不正之处，也希望回复留言以告知！