6

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

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

这是我觉得知道答案可能会打开更深层次理解库和语言的大门的事情之一。

4

2 回答 2

2

除非有人能够指出 John Resig 专门解决该问题的文章,否则我怀疑是否提供了明确的答案。但当我开始使用 jQuery 时,我经常想知道这一点,并得出结论认为它是危害最小的东西。毕竟,您完全有可能只需要 DOM 元素。如果您需要/想要在它周围使用 jQuery 包装器,那么只需$()三个击键即可(或者更多人做这var $this = $(this);件事)。与让库始终为您做这件事相反,这涉及到多个函数调用和内存分配,而您很可能不需要它。

例如,考虑:

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

在那里,没有任何理由在 DOM 元素周围使用 jQuery 包装器。this.value是所有input领域所需的一切(除了input type="file",但val()也不会帮助你)。在事件处理程序中(其中this也“只是”原始元素),您可能根本不看this

但在这种情况下:

$(":input").each(function() {
    var val = $(this).val();
    // Use `val`
});

...使用 有一个真正的原因$(this):input选择器匹配几种不同的元素类型(input, select, button, textarea),它们的值来自不同的属性,并val()为您抽象出来。

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

于 2012-01-09T00:25:28.450 回答
2

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

我确信这正是它。如果您可能不需要 jQuery 包装器(确实存在 - 直接在 DOM 属性上工作并不少见,尤其是在回调函数中,例如val; 实际上,您可能根本不需要查看元素),那么您不想在创建 jQuery 对象时浪费时间和处理资源。

例如,这里有一个 jsperf,它表明对循环中的每个元素执行操作所带来的开销与函数本身$(this)执行的开销一样多。each

于 2012-01-09T00:27:43.840 回答