使用jQuery时定义$ this是不是多余的？

Question

我在使用jquery的函数中看到了以下定义。

var $this = jQuery(this);

这不是多余的吗？等式的两边都说明了同样的事情。

Answer 1

我认为$this中的$是令人困惑的部分。使用$前缀变量只是表示变量是jQuery对象的约定。这就是全部 - 它可以被称为myElement，它也是一样的。

如果问题的一部分是为什么你首先持有变量，那么部分是关于效率和部分关闭（保留范围内的东西）。

所以，这样做是为了避免继续将DOM元素评估为jQuery对象：

var $this = $("#container");
$this.addClass("highlight");
$this.focus(function() { alert("Got Focus!"); });

并保持范围（由于关闭）：

var $this = $("container");
$("#send").click(function() {
    //$this still in scope now
    $this.addClass("highlight"); 
});

Answer 2

这有各种用途。一个常见原因是允许在另一个函数中捕获定义的变量。例如，考虑一下：

var $this = jQuery(this);
$.get('/some/url', function (result) {
    // do something with result
    // and something with $this;
});

如果此代码位于元素的单击处理程序中，那么this当然会引用该元素。但是，在AJAX回调中，this的上下文已丢失。通过将其存储在变量中，该函数能够捕获对该变量的引用，并保留对调用处理程序的元素的引用。

Answer 3

两个很好的理由：

1. 缓存。

   出于性能原因，如果您要在单个代码块中多次使用$(this)，最好将其存储到变量中一次并使用它。这避免了程序必须多次重新评估相同的函数调用，这样可以节省内存和处理器的功率。

   var $this = $(this);
   $this.hide();
   //...do something...
   $this.show();   //doesn't need to evaluate $(this) again.
   

2. 范围缩小。

   Javascript中的变量名this具有特殊含义。通常在使用闭包函数时，内部函数将拥有它自己的this，这意味着你不能使用外部函数的this值，除非你将它的副本存储在一个单独的变量中保留范围。定义一个名为that或self的局部变量或类似的东西是很常见的，它允许你将其范围传递给内部函数。 $this可用于同一目的。

   var $this = $(this);
   $('.something').each(function() {
       //in this function $(this) would be for the item being looped
       //but $this was defined earlier, so still refers to the original object.
   };