$（）。每个vs $ .each vs for jQuery中的循环？

Question

我无法理解为什么会这样。

我读了here：

  

第一个 $。每个构成单个函数调用以启动   迭代器。

     

第二个 $（foo.vals）.each 使三个函数调用启动   迭代器。

     

  
• 第一个是$（），它生成一个新的jQuery包装器   set（不确定在此期间进行了多少其他函数调用   处理）。
  
• 然后调用$（）。每个。
  
• 最后它使内部   调用jQuery.each来启动迭代器。
  

     

在你的例子中，差异可以忽略不计。   但是，在嵌套使用场景中，您可能会发现性能正在下降   一个问题。

     

最后，JQuery Enlightenment中的Cody Lindley不推荐使用   由于函数调用，$ .each用于大于1000的迭代   参与其中。使用法线（var i = 0 ... loop。

所以我用这个jsperf测试了它：

（任务：找到已经检查过其内部复选框的Tr，并将该颜色设为tr。）

这是 jsbin

但请看 jsperf

违背所有期望，相反是真的。 （chrome和FF和IE）

使用$().each的人（调用三种方法最快 等等。

这里发生了什么？

Answer 1

您的测试太重，无法确定三个循环选项之间的实际差异。

如果你想测试循环，那么你需要尽力从测试中删除尽可能多的非相关工作。

目前，您的测试包括：

• DOM选择
• DOM遍历
• 元素突变

与循环本身相比，所有这些操作都非常昂贵。删除多余的东西时，循环之间的区别更加明显。

http://jsperf.com/asdasda223/4

在Firefox和Chrome中，for循环比其他循环快100多倍。

Answer 2

好

• $.each()是一个正在执行的jQuery函数，它将用于遍历列表，因此开销应该是jQuery函数以及为列表中的每个项调用该函数的开销。在这种情况下
• $(thing).each()这背后的想法是$(thing)创建一个jQuery实例，然后迭代这个实例（.each对该实例进行操作）。在你的情况下，因为你调用它的实例已经是一个jQuery对象，所以开销很小（你是一个实例，哦，是的）。
• for()在这种情况下，除了在每次迭代中查找列表的长度外，根本没有开销。

考虑一下：

var l = g.length;
for (var i=0;i<l;i++) {
    // code;
}

根据您的HTML，大部分时间都可能在Sizzle Jquery解析器中找到文档中的选择器。

另外请注意，我认为你的选择器不是最好的，除非事情发生了很大变化，最近jQuery选择器从右到左进行了评估，考虑通过对下面的所有内容执行.find()来限制选择器的范围。 id引用的第一个标记，因为它将只搜索文档的一个子集。

Answer 3

对“任务”的不同方法http://jsfiddle.net/ADMnj/17/

但我认为性能问题来自于你没有在正确的事情中说明选择器

#t tr input:checkbox:checked 

VS

#t tr :checkbox:checked 

检查是否选中了复选框的正确方法是将其称为

#t tr input[checked="checked"]

W3.ORG's selector list see the E[foo]

最后但并非最不重要的是最快的也是最短的代码，可能是你从3行对4和5行代码得到的轻微性能不同但不能证明这一事实