Javascript 在jQuery中缓存或不缓存$(this)
当选择器为Javascript 在jQuery中缓存或不缓存$(this),javascript,jquery,Javascript,Jquery,当选择器为$(this)时,创建和重用引用是否会显著提高性能 在同一范围内多次使用同一选择器时,我会为jQuery选择器创建引用。下面的方法更有效 var jSel = $('div.some_class input.some_other_class'); some_function1(jSel); some_function2(jSel); 比这个 some_function1($('div.some_class input.some_other_class'
$(this)
时,创建和重用引用是否会显著提高性能
在同一范围内多次使用同一选择器时,我会为jQuery选择器创建引用。下面的方法更有效
var jSel = $('div.some_class input.some_other_class');
some_function1(jSel);
some_function2(jSel);
比这个
some_function1($('div.some_class input.some_other_class'));
some_function2($('div.some_class input.some_other_class'));
但是如果选择器只是$(this)
,其中this
是jQuery方法中的dom元素,该怎么办呢。我应该费心创建一个对$(this)
的引用并重用该引用,还是可以创建多个$(this)
选择器并期望类似的性能
以下是
var jSel = $(this);
some_function1(jSel);
some_function2(jSel);
明显比下面的速度快
some_function1($(this));
some_function2($(this));
此
是对对象的引用。使用$(this)
需要一点时间(因为jQuery将其转换为数组),但这一次与IMHO无关。所以第一种方法应该快一点,但实际上你不会注意到区别。这完全取决于你打了多少个电话。将一个变量设置为某个可以工作的变量肯定比继续做同样的工作要快,但在您的示例中,差异将是极其微不足道的。如果在一个500万次的循环中执行此操作,那么差异将不那么可以忽略,并且设置变量将更快,因为它只执行一次操作,而不是500万次
以下速度是否明显快于以下速度
some_function1($(this));
some_function2($(this));
否。它在显微镜下速度更快;在几微秒的范围内
这是否会阻止您将结果分配给变量并使用它否。使用变量可以赋予此内容更多含义,并且更易于键入。另外,如果您不再想对$(this)
,而是想对$(this)进行操作。next()
,则必须在一个位置更改它,而不是n
您会发现jQuery构造函数经过了高度优化,可以接受单个DOM元素作为参数。以下是调用$(domeElement)
(当然)时执行的命令:
在这种特殊情况下,如果您真的在编写期望jQuery对象作为参数的函数(如示例中所示),则可以将这些函数作为jQuery方法重新编写。然后你可以写:
$(this).some_function1().some_function2();
编写jQuery方法非常容易,至少是简单的方法。一般(同样,简单)形式为:
应该给你一个速度差的基本概念。在大多数简单的情况下,它可能不会显著地影响代码执行速度,但是JS是一个瓶颈,每一点都有帮助,它总是一个最佳选择,使良好的实践成为常规 lil基准:
或()是的,我同意。但是我想让我的示例保持简单,因为扩展jQuery并不是问题的焦点。好的,一般来说,进行函数调用比不进行函数调用花费更多的时间。因此,缓存
$(this)
的结果将节省少量时间。那值不值得由你决定。对我来说,缓存$(this)
是值得的,因为它引入了清晰的含义,特别是如果你给这个值起了一个好名字的话。你总是缓存$(this)
,还是只是有时候?在一个非常简单的函数中,通常不会。然而,在更大的事件处理程序或类似的东西中,它有助于澄清发生了什么。
jQuery.fn.some_function = function() {
return this.each(function() {
// stuff you want to do
});
};