JavaScript 的 ～～ 运算和floor 的性能差异

在JavaScript中，~~（双波浪号）和Math.floor()都可以用于向下取整，但它们在行为和性能上有一些差异。要测试这两者之间的性能差异，你可以使用JavaScript的performance.now()方法来进行基准测试。

行为差异

1. Math.floor():

   • 对于正数，它向下取整。
   • 对于负数，它远离0的方向取整（即更负）。
   • 对非数值进行操作时返回NaN。

2. ~~:

   • 实际上是一个位操作符，它首先将数字转换为32位整数，如果数字不在32位整数的范围内，会发生溢出。
   • 对于正数和负数，它向0的方向取整。
   • 对非数值进行操作时，它通常会将其转换为0。

性能测试

要比较~~和Math.floor()的性能，可以编写一个简单的基准测试脚本：

function testPerformance(func, iterations) {var start = performance.now();for (var i = 0; i < iterations; i++) {func(Math.random() * 1000 - 500);}var end = performance.now();return end - start;
}var iterations = 1000000; // 测试的迭代次数
var timeForFloor = testPerformance(function(x) { return Math.floor(x); }, iterations);
var timeForDoubleTilde = testPerformance(function(x) { return ~~x; }, iterations);console.log('Math.floor(): ' + timeForFloor + 'ms');
console.log('~~: ' + timeForDoubleTilde + 'ms');

在这个脚本中，我们创建了一个testPerformance函数，它接受一个函数和迭代次数作为参数。我们用随机数来测试Math.floor()和~~，然后记录下所需的时间。

可以看出差异并不大，百万级调用才有10ms的差异，几乎可以忽略不计。

何时使用哪个

• 如果你需要绝对的精确性和对边界值的正确处理（特别是对于非数值或极大的数值），使用Math.floor()更为妥当。
• 如果你正在处理的是正数或负数，并且对性能有较高的要求，可以考虑使用~~。但请注意，这只适用于32位整数范围内的数字。

在大多数现代JavaScript引擎中，性能差异可能不太明显，除非你正在进行大量的计算。因此更重要的是考虑它们的行为差异和代码的可读性。

---

看完本文如果觉得有用，记得点个赞支持，收藏起来说不定哪天就用上啦～

专注前端开发，分享前端相关技术干货，公众号：南城大前端（ID: nanchengfe）