Question

我最近发表了一篇关于jQuery性能的博客文章（即http://net.tutsplus.com/tutorials/javascript-ajax/10-ways-to-instantly-increase-your-jquery-performance/），并且在所有这些帖子中都说我们应该将jQuery对象缓存到javascript变量。

但我需要知道的是，这是否也适用于$（this）。如果我这样做，我会获得性能：

$("#some-link").click("click", function(){
  var $this = $(this);
  $this.doSomeThing();
});

提前感谢您的帮助。

Answer 1

this可能涉及许多不同的对象。

缓存$(this)可能并不重要，因为this已经是当前元素，因此jQuery不需要在DOM中搜索此元素。

但是，在单个函数中，如果您有多次调用$(this)，最好将$(this)放入变量，而不是多次调用$(this)。

$("#some-link").click("click", function(){
  var $this = $(this);
  $this.doSomeThing();
  $this.doThisThing();
  $this.doThatThing();
});

会比

更有效率

$("#some-link").click("click", function(){
  $(this).doSomeThing();
  $(this).doThisThing();
  $(this).doThatThing();
});

Answer 2

好吧，如果你只使用$ this一次，它确实没有用，但是如果你再使用它一次，它应该会获得性能。

最大的问题是，性能有多大？它可能难以衡量。但无论如何，这是一个很好的做法。

Answer 3

这实际上是一个简单的问题，关于javascript本身。如果将变量分配给通过运行函数收集的对象，并且如果您需要多次使用该对象，则显然您将提高性能。

减少函数调用，你正在前往它：）

Answer 4

多次访问时，缓存this总是一个好主意。关于性能的一个注意事项是this是一个JavaScript对象 - 我已经看到很多代码在this周围没有任何理由包装jQuery对象。

考虑这段代码：

... (function ()
{
    alert($(this).attr("class"));
});

更清洁，更快一点：

... (function ()
{
    alert(this.className);
});

的更新

响应您的更新......正在执行：

... (function () { var that = $(this); that.functionCall(); });

不提高性能。它实际上要慢一点，因为你在jQuery对象中包装this之上创建了一个变量。

如果您要对that - 缓存的$(this) jQuery对象进行多次操作，您将看到性能提升......具体取决于操作次数：

... (function () // calling a function 1000 times on a cached jQuery object { var that = $(this); for (var i = 0; i <= 1000; i++) { /* using a cache will greatly increase performance when doing 1000 operations. */ that.functionCall(); } });

另外注意：如果您对jQuery性能优化感兴趣，那么jQuery Tips and Tricks问题中有很多很棒的提示。试一试：）

Answer 5

我的猜测是，如果你多次使用$（this）会很有用。

在你的例子中，我认为它不会产生那么大的差异。

Answer 6

嗯，执行函数，运行init逻辑并返回一个对象会产生性能成本，虽然可能是一个非常小的性能成本，所以在这种特殊情况下，缓存的需求可能不大

但是，为了符合代码，最好缓存多次使用的对象，因为在其他情况下性能差异可能很大，因此养成习惯是件好事。

是否需要缓存jQuery $（this）

6 个答案: