javascript - 在 javascript 中,访问 'window.Math' 比访问没有 'Math' 的 'window.' 对象慢还是快?

标签 javascript performance window global-variables global

我很好奇在 javascript 中引用“全局”命名空间时的最佳实践是什么,它只是 window 对象的快捷方式(反之亦然,具体取决于您的外观在它)。

我想知道是否:

var answer = Math.floor(value);

优于或低于:

var answer = window.Math.floor(value);

在性能、资源使用或兼容性方面是更好还是更差?

是否有更高的成本? (比如额外的指针之类的东西)

编辑说明:虽然在大多数情况下我是一个可读性高于性能的纳粹分子,但在这种情况下,我忽略了可读性的差异,只关注性能。

最佳答案

首先,切勿出于性能原因比较此类内容。 Math.round 显然比 window.Math.round 在视觉上更容易,并且您不会看到使用其中一个或另一个有明显的性能提升。因此,不要为了非常轻微的性能提升而混淆您的代码。

但是,如果您只是想知道哪个更快……我不确定全局范围是如何“在引擎盖下”查找的,但我猜想访问 window 与访问 Math 相同(windowMath 处于同一级别,如 window.window.window 所证明.Math.round 工作)。因此,访问 window.Math 会更慢。

此外,通过查找变量的方式,您会发现通过执行 var round = Math.round; 和调用 round(1.23) 可以提高性能,因为所有名称首先在当前局部作用域中查找,然后是当前局部作用域之上的作用域,依此类推,一直到全局作用域。每个范围级别都会增加非常少的开销。

但再次提醒,不要进行这些优化,除非您确定它们会产生显着差异。可读、可理解的代码对于它现在和将来按应有的方式工作非常重要。

这是使用 Firebug 的完整分析:

<!DOCTYPE html>
<html>
    <head>
        <title>Benchmark scope lookup</title>
    </head>
    <body>
        <script>
        function bench_window_Math_round() {
            for (var i = 0; i < 100000; i++) {
                window.Math.round(1.23);
            }
        }

        function bench_Math_round() {
            for (var i = 0; i < 100000; i++) {
                Math.round(1.23);
            }
        }

        function bench_round() {
            for (var i = 0, round = Math.round; i < 100000; i++) {
                round(1.23);
            }
        }

        console.log('Profiling will begin in 3 seconds...');
        setTimeout(function () {
            console.profile();
            for (var i = 0; i < 10; i++) {
                bench_window_Math_round();
                bench_Math_round();
                bench_round();
            }
            console.profileEnd();
        }, 3000);
        </script>
    </body>
</html>

我的结果:
Time 显示 100,000 * 10 次调用的总时间,Avg/Min/Max 显示 100,000 次调用的总时间。

Calls  Percent  Own Time   Time       Avg        Min        Max
bench_window_Math_round
10     86.36%   1114.73ms  1114.73ms  111.473ms  110.827ms  114.018ms   
bench_Math_round
10      8.21%    106.04ms   106.04ms   10.604ms   10.252ms   13.446ms   
bench_round
10      5.43%     70.08ms    70.08ms    7.008ms    6.884ms    7.092ms

如您所见,window.Math 是一个非常糟糕的主意。我想访问全局 window 对象会增加额外的开销。但是,从全局范围访问 Math 对象与仅通过引用 Math.round 函数访问局部变量之间的区别不是很大。 . 请记住,这是 100,000 次调用,差异仅为 3.6 毫秒。即使有 100 万次调用,您也只会看到 36 毫秒的差异。

使用上述分析代码需要考虑的事项:

  • 函数实际上是从另一个范围查找的,这增加了开销(尽管几乎没有注意到,我尝试将函数导入匿名函数)。
  • 实际的 Math.round 函数会增加开销(我猜 100,000 次调用大约需要 6 毫秒)。

关于javascript - 在 javascript 中,访问 'window.Math' 比访问没有 'Math' 的 'window.' 对象慢还是快?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2125113/

相关文章:

.net - 如何加快我的 .NET 应用程序第一次执行的性能?

c# - WPF 窗口应该是 native 所有者窗口的模式,但不是

javascript - 选择多个元素 height();

javascript - 如何使用 Javascript 检查是否在其他单选按钮中选中了特定的单选按钮?

javascript - 如何在javascript中实现python的namedtuple

javascript - jQuery/JS、iOS 4 和 $(document).height() 问题

java - 为什么 FPS 不打印在我的窗口中?

javascript - 将 Intro.JS 库添加到 Vue-Cli/Webpack 项目

java - 调试慢速 Java 方法

mysql - 将行的子集从一个表复制到另一个表,过滤两列