内存中的 Javascript 类初始化和 jQuery DOM

Question

哪个是最好的方式:

var myClass = function() {
    this.myContainer = function(){ return $(".container");}
    this.mySubContainer = function(){ return this.myContainer().find(".sub"); }
}

和

var myClass = function() {
    this.myContainer = $(".container");
    this.mySubContainer = this.myContainer.find(".sub");
}

有什么具体的区别吗？

当我看到我的网页有足够的 javascript(我的大约 150KB + 库)需要超过 300-400MB 的 RAM 时，内存问题就出现了。我正在尝试找出问题所在，但我不知道这是否是其中之一。

Answer 1

function myClass{
    this.myContainer = function(){ return $(".container");}
    this.mySubContainer = function(){ return this.myContainer().find(".sub"); }
}

在这里您需要将其命名为 myClassInstance.myContainer()，这意味着 jquery 将在您使用它时随时搜索​​ .container 元素功能。另外，每当您创建类的新实例时，它都会创建 2 个额外的闭包。这将占用一些额外的内存。

function myClass{
    this.myContainer = $(".container");
    this.mySubContainer = this.myContainer.find(".sub");
}

在这里，myContainer 指向一个对象，该对象已经包含指向 DOM 节点的所有链接。每当您使用 myClassInstance.myContainer

时，jQuery 都不会搜索 DOM

因此，如果您不想降低应用程序的速度，则第二种方法更好。但如果您的 DOM 经常被修改，第一种方法可能会有用。但我不相信你修改得太频繁以至于你可能需要使用第二种方法。