在jQuery中$ this vs $（this）

Question

我在jQuery上看到了關於$(this) vs $this一些討論，它們對我有意義。 （有關示例，請參見此處的討論 。）

但是下面的代碼片段，來自jQuery網站插件教程，展示了可鏈接性如何工作？

(function ($) {

    $.fn.lockDimensions = function (type) {

        return this.each(function () {

            var $this = $(this);

            if (!type || type == 'width') {
                $this.width($this.width());
            }

            if (!type || type == 'height') {
                $this.height($this.height());
            }

        });

    };
})(jQuery);

這個$this代表什么？ 就在我認為我弄清楚的時候......

Answer 1

$this只是一個普通的變量。 $字符是變量名中的有效字符，因此$this與任何其他非保留變量名稱相同。 它在功能上與調用變量JellyBean 。

Answer 2

你通常使用var $this = $(this); 避免創建一個新的jQuery對象而不是必要的。 如果是下面的代碼，則只創建一個對象而不是兩個/四個。 它與可鏈接性完全無關。

你也可以把它叫做that ， $thi$或其他任何東西（不使用，雖然后者的一個，它的丑陋：P）為$只是在JavaScript一個簡單的人物，酷似AZ的。

Answer 3

this在javascript（通常）中表示對調用當前函數的對象的引用。 這個概念有點模糊了jQuery試圖在他們的.each()循環結構中使用this更友好的用戶。

在 .each() ， this表示調用.lockDimensions的jQuery對象。

在 .each()它表示當前迭代的DOM對象。

通常，將$(this)存儲在局部變量中的目的是阻止您多次調用jQuery函數$() ，緩存jQueryized如果必須多次使用它， this應該有助於提高效率。

$只是一個有效的變量名字符，用作變量名的第一個字符， 通常是為程序員排隊它已經是一個jQuery對象（並且有相關的方法/屬性可用）。

這個問題其實是無關鏈的能力，但要保持你應該返回鏈能力this使得可以添加其他函數調用，和保持的意義this在那些電話也是如此。

Answer 4

你可能忽略了這一行：

var $this = $(this);

這里， $this只是一個保存$(this)值的變量。 您可以與$(this)互換使用它，並且您不會反復進行相同的查找。

Answer 5

$this只是一個局部變量，以這種方式提醒你$(this) 。 它可以節省創建的jQuery的版本的工作this ，你可以使用它的次數。

Answer 6

$this是只是一個本地副本this包在jQuery的。

從長遠來看，保持一個本地副本，而不是包裝this是每次需要時更加高效。

Answer 7

$this = $(this)是一種緩存jQuery對象的方法。 每次運行jQuery函數都很昂貴，因此存儲輸出允許您一遍又一遍地重復使用選擇器而無需再次調用jQuery函數。

Answer 8

 $this = $(this)

這意味着您將當前對象分配給名為$this的變量。 它不是關鍵字。

它只是一個變量名。

Answer 9

它只用$(this)填充$this變量，所以你不必每次調用都要查找$(this)元素。 它有更好的性能

var $this = $(this);

Answer 10

這很簡單： $this = $(this) 。 它只是內部函數范圍內使用的簡寫。 在這種情況下，美元符號只是一個字符，它根本不涉及jQuery。 它可能也被命名為_this或xthis ， $只是提醒變量包含的內容。

它可能看起來毫無意義，但它消除了三個冗余方法調用（ $()函數不是免費的）因此出於性能原因最有可能使用它。

Answer 11

在$.fn.lockDimensions ， this是在其上調用lockDimensions的jQuery對象。

里面.each ， this現在引用在循環的當前迭代的一個DOMElement。 $(this)將DOMElement包裝在jQuery對象中， var $this = $(this); 只是將$(this)保存在一個名為$this的變量中，因此不需要多次調用jQuery構造函數（如果你要使用$(this) ）。

Answer 12

$ sign通常在JavaScript中的變量名之前用於區分一般值和jQuery對象。 因此，這里$this只是得到的值$(this) ，返回的jQuery對象this 。 $只是有效變量名稱的一部分。

Answer 13

我想跳到這里，即使我沒有專業的jQuery技能。

無數次我看到類似於以下代碼或概念的行：

var $this = $(this);

所以我重寫它類似於：

var $jims_this = $(this);

並測試它。 我這樣做也是為了解決我可能遇到的任何困惑。

這是類似的解釋不佳的代碼的另一個例子：

 <style>
    a.a { font-weight: bold; }
 </style>

接下來，將addClass調用添加到腳本中：

  $("a").addClass("a");

這確實有效，但令人困惑。 它原本可以寫成：

<style>
a.my_bold_class { font-weight: bold; }
</style>

 $("a").addClass("my_bold_class");

吉姆

Answer 14

$this是一個名為$this的變量，包含對$(this)的引用。 有點無意義的IMO。

Answer 15

你已經徘徊在javascript范圍和閉包領域。

簡而言之：

this.bar()

在foo的范圍內執行，（因為這指的是foo）

var barf = this.bar;
barf();

在全球范圍內執行。

this.bar基本上意味着：

在this（foo）的范圍內執行this.bar指向的函數。 將this.bar復制到barf時，運行barf。 Javascript理解為，運行barf指向的函數，並且由於沒有這個，它只是在全局范圍內運行。

要更正此問題，您可以更改

barf();

這樣的事情：

barf.apply(this);

這告訴Javascript在執行它之前將其范圍綁定到barf。

對於jquery事件，您將需要使用匿名函數，或者在原型中擴展bind函數以支持范圍。