Question

有人看到我使用以下JQuery代码：

function showAll(){
    $(".button").show();
}
function hideAll(){
    $(".button").hide();
}

他说这是浪费资源。我应该首先将$(".button")分配给变量，然后对此变量执行show()和hide()方法，如下所示：

var allButtons = $(".button");
function showAll(){
    allButtons.show();
}
function hideAll(){
    allButtons.hide();
}

这两个版本都有效，但这对性能有什么好处？我相信这个好处可以忽略不计，而且很麻烦，因为现在你在类名和你正在修改的变量之间有了另一层次的分离，但他有一个有效的点吗？是两个被认为是最佳实践之一吗？

Answer 1

代码之间主要有三个不同之处：

性能。是的，保持元素集合而不是每次都能找到它们会更高效。
全球名称。使用全局变量来保留集合意味着与其他代码冲突的风险更高。每次执行此操作时，您必须为您使用它的页面/页面组成一个新名称。
功能差异。如果保留元素集，则意味着动态添加的任何元素都不会包含在后续调用中，并且删除了类的元素仍将包含在集合中。每次创建集合意味着您使用当时与选择器匹配的元素。

由于更改实际上会改变行为，因此您必须考虑它是否仍然按照您的要求进行操作。

如果你想提高性能，你应该考虑代码是否在可以注意到差异的地方，以便使代码稍微复杂一些。