Javascript 用变量替换$（this）是否会产生性能差异

我有一个这样的循环：

$('#SomeSelectorID').find('.SomeElementsByClassName').each(function () {

    $(this).some code here;
    $(this).some other code there;
    $(this).some other code here and there;
});

---

如果我在循环的顶部写入

var TheThis=$（this）

然后将

$（this）

替换为

这是性能优化还是非性能优化？
当然是性能优化。不管是否值得，这才是真正的问题。如果你是在重复DOM，那么肯定是值得的。在本例中，您只是在jQuery中包装一个对象，因此占用空间要小得多

也就是说，您获得了一点性能，但在可读性、可维护性或其他方面没有损失任何东西，您通常必须牺牲这些东西来获得性能，因此您最好进行调整。
这是一个明确的性能优化。一个你可能不会注意到的，但这不是不做的理由

示例中的代码意味着将对DOM进行3次查询，以查找
$（this）
元素，然后对其执行操作。将其缓存在变量中意味着这只会发生一次

如果你真的想看到差异，试着在测试中将你的原稿与下面的进行比较

嗯，嗯

一般来说，调用任何函数都是一种开销。调用
$（）
是一个巨大的问题（将调用时间与进行比较），应该尽量避免

将其返回值存储在变量中总是一件好事，但它也避免了某些“陷阱”

例如，假设您希望将所有
.test
元素更改为绿色，并删除该类。您可以这样做：

$(".test").removeClass("test");
$(".test").css({"color":"green"});

结果发现它不会将颜色更改为绿色，因为
$（“.test”）
不再是一回事了

相反，如果您已经这样做：

var test = $(".test");
test.removeClass("test");
test.css({"color":"green"});

它起作用了。当然，这是一个简单的例子，因为您可以重新排列代码行，它也可以工作，但我想在这里指出一点：p
测试这对性能没有影响，至少在Chrome上是这样的：

var start = new Date().getTime(),
    iterations = 50000;

$('#foo').find('.bar').each(function () {

    var that = $(this);

    for(var i = 0; i < iterations; i++)
      that.find('i');

});

console.log(new Date().getTime() - start);

var start=new Date（）.getTime（），
迭代次数=50000次；
$（'#foo'）。查找（'.bar'）。每个（函数（）{
var，该值=$（此值）；
对于（var i=0；i

使用
$（此）
结果大致相同

是的存在性能惩罚。我创建了一个小演示，演示了使用$（this）比使用存储版本要慢

JSFiddle演示

不我认为您不需要更改代码。这种情况下的好处非常小，您几乎不会注意到任何差异。也许在另一种情况下，你正在开发一款游戏或数据处理应用程序，这可能很重要

这是我的测试结果

Testing jquery version...
1000000 iterations $(this): 0.006849ms
Testing non-jquery version...
1000000 iterations of this$: 0.001356ms

有人说是,有人说不是。我的观点是，它过去是有意义的，但是现在浏览器做得非常好，以至于
这个
关键字可能会以某种方式被缓存，所以在大多数情况下，你永远不会注意到有什么不同。你能测量它吗？如果是的，而且它正处在一条关键的道路上，那么它可能是值得的。如果没有，那么您的时间远比侵入性更改更有价值，这可能会导致毫无益处的回归。@adeneo浏览器是否缓存
此
，问题在于缓存
$（此）
有什么原因您不能只链接函数吗<代码>$（this）.someCodeHere（）.someothercodehere（）.someothercodehere（）

@ian-当传递函数

this

时，你可能每秒调用

$（）

函数数十亿次，因为这样会立即返回对象，不需要额外的东西，所以性能的提升几乎是无法估量的。我想我问的原因是我有大约14K行javascript要处理，我想知道这是否值得去做。@frenchie它归结为：你得到了一点，什么也没有损失，为什么不呢？“当然这是一个性能优化”-如果可以证明函数是纯的，在这种情况下，可能不会增加额外成本。即使今天没有人这么做，也不意味着明天也没有人这么做。@frenchie如果你有14k行代码，这绝对值得一做，如果你没有缓存任何选择器，这可能会产生很大的影响，这取决于14k行代码中有多少作用域，每个

这个
在它的范围内使用了多少次等等。在这种情况下不应该有“DOM询问”
此
是传递给
jQuery（）
的DOM元素。它不需要查找它。不过，这是对函数的一个不必要的调用。@JamesMontagne对于这种特殊情况有很好的说明。然而，缓存选择器的结果总是一种好的做法，无论是通过还是其他方式。对，这甚至是有争议的唯一原因是因为它是
this
。如果它是一个选择器，而不是
这个
，那么毫无疑问，这是一个性能改进。这都是事实，但并不特别适用于这个问题<代码>$（）
在传递
this
时绝不是“巨大的”。它很小。不过，我确实喜欢这个链接。有趣的是：Opera在DOM中的运行速度似乎比IE和Chrome慢10倍
Testing jquery version...
1000000 iterations $(this): 0.006849ms
Testing non-jquery version...
1000000 iterations of this$: 0.001356ms