Question

理论案例。 功能init ()可能无法始终在页面上调用。我想知道的是，两个脚本之间的速度/效率是否存在差异？ Class是单身的事实会对加载速度/处理量产生影响吗？

脚本1：

// Class is a singleton.
var Class =
{
    myFunctionOne : function ()
    {
    }

    myFunctionTwo: function ()
    {
    }
}

function init ()
{
    //Do some fancy stuff

    Class.myFunctionOne();
    Class.myFunctionTwo();
}

脚本2：

function Class ()
{
    this.myFunctionOne = function ()
    {
    }

    this.myFunctionTwo = function ()
    {
    }
}

function init ()
{
    var myClass = new Class();

    //Do some fancy stuff

    myClass.myFunctionOne();
    myClass.myFunctionTwo();
}

Answer 1

我会说是的，当init()在页面上调用而不是时，您的第二个脚本具有性能优势。这就是原因。

在第一个示例中，每次加载页面时都会解析对象文字：

var Class =
{
    myFunctionOne : function () { ... }
}

将构建Class对象，每个键设置为一个函数对象。无论是否实际调用这些“方法”，都会产生这种开销（但是，某些JavaScript编译器可能会在此处实现优化，例如“即时编译”，因此实际的性能增益可能会因浏览器而异）

在你的第二个例子中：

function Class ()
{
    this.myFunctionOne = function () { ... }
}

每次调用myFunctionOne时都会运行Class行，在您的情况下，通过new运算符。每次Class实例化时都会产生此费用，而不是每次加载一次。但是你已经声明这个类使用单例模式，所以你总是只有一个实例。

Answer 2

如果您担心初始页面加载/处理时间，为什么甚至在页面上有代码。动态加载JavaScript。

function init() {
    if(!document.getElementById("SingletonClass")) {
        var dynScript = document.createElement('script');
        dynScript.id = "SingletonClass";
        dynScript.type = "text/javascript";
        dynScript.src = "SingletonClass.js";
        document.getElementsByTagName('head')[0].appendChild(dynScript);
    }
}

或者只是使用jQuery getScript函数。 http://api.jquery.com/jQuery.getScript/

这些脚本之间的效率是否存在差异？

2 个答案: