Question

我在jQuery中看到了关于$(this) vs $this的一些关于SO的讨论，它们对我有意义。（有关示例，请参阅discussion here。）

但是下面的代码片段，来自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

javascript中的

this（通常）表示对调用当前函数的对象的引用。 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)。它节省了创建this的jQuery版本的工作，您可以多次使用它。

Answer 6

$this只是jQuery中包含的this的本地副本。

从长远来看，保留本地副本而不是每次需要包装this都会更有效率。

Answer 7

$this = $(this)是一种缓存jQuery对象的方法。每次运行jQuery函数都很昂贵，因此存储输出允许您反复使用选择器而无需再次调用jQuery函数。

Answer 8

它只会使用$this填充$(this)变量，因此您无需在每次调用时查找$(this)元素。它具有更好的性能

var $this = $(this);

Answer 9

 $this = $(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

$符号通常在JavaScript中的变量名之前使用，以区分常规值和jQuery对象。所以这里$this只获取$(this)的值，它返回this的jQuery对象。 $只是有效变量名称的一部分。

Answer 13

$this是一个名为$this的变量，其中包含对$(this)的引用。有点无意义的IMO。

Answer 14

我想跳到这里，即使我没有专业的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 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函数以支持范围。

在jQuery中$ this vs $（this）

15 个答案: