在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函数以支持范围。