为什么jquery中的'this'将回调链接为DOM元素?

时间:2012-01-09 00:15:44

标签: javascript jquery library-design

所以我知道在使用$.fn.each$.fn.bind等时,jQuery链接回调中的this关键字是DOM元素的标准。

我知道在我的开发中至少我通常希望DOM元素包含在jQuery集中 - 有90%的时间我最终都在做var $this = $(this)。我确信他们为什么选择绑定到未包装的元素有一个很好的(可能是基于性能的)理由,但有人知道它到底是什么吗?

这是我觉得知道答案的事情之一,可能会为更深层次的图书馆和语言打开大门。

2 个答案:

答案 0 :(得分:2)

除非有人能够指出John Resig专门针对这个问题的文章,否则我怀疑是否有一个明确的答案。但是当我开始使用jQuery时,我经常想知道这一点,并且得出的结论是它是最不利的东西。毕竟,完全有可能你需要的只是DOM元素。如果你需要/想要在它周围使用jQuery包装器,那么$()只需要三次击键(或者更多的人做var $this = $(this);事情)。而不是让总是为你做这个,它涉及多个函数调用和内存分配,当你很可能不需要它时。

例如,考虑:

$("input").each(function() {
    // Use this.value
});

在那里,围绕DOM元素的jQuery包装器没有任何理由。您只需要this.valueinput字段input type="file"以外的所有字段val(),但this也无法为您提供帮助。在事件处理程序中(this也是"只是"原始元素),您可能根本不会查看$(":input").each(function() { var val = $(this).val(); // Use `val` });

但在这种情况下:

$(this)

...这是使用:input的真正原因:input选择器匹配多种不同的元素类型(selectbutton,{{1} },textarea),其值来自不同的属性,val()为您抽象。

所以我得出结论,提供原始元素是一种表现的东西。如果您根本不使用它,或者您只使用它的基本DOM属性,则无需将其包装在jQuery实例中。如果您需要/想要这样做,可以在您的代码中执行此操作。

答案 1 :(得分:2)

  

我确信有一个很好的(可能基于绩效的)理由

我确信这正是它。如果你有可能不需要jQuery包装器(它有 - 直接在DOM属性上工作,特别是在回调函数如val时几乎不常见;实际上,你可能不需要查看元素在所有情况下)然后你不想在创建jQuery对象时浪费时间和处理资源。

例如,here's a jsperf表明在循环中的每个元素上执行$(this)都会带来与each函数本身一样多的开销。