jQuery $.each与JavaScript .forEach的区别

Question

使用jQuery 移除DOM中的一个元素数组有以下两种方式：

var collection = [...]; //  An array of jQuery DOM objects

// Using jQuery iteration
$(collection).each(function(index, element) { element.remove(); });

// Or as pointed out by Barmar
$(collection).remove();

// Using native iteration
collection.forEach(function(element) { element.remove(); });

操作上有实际区别吗？我认为，除非浏览器的解释器/编译器足够聪明，否则使用前一种方法可能会产生额外的不必要开销，虽然如果数组很小，这种情况可能是微不足道的。

- Lee

---

你的第二个例子存在偏见，因为它仍然使用了jQuery。collection.forEach(function(element) {element.parentNode.removeChild(element);})是更公平的比较。 - Niet the Dark Absol

不，$(selector).each() 调用函数时使用元素作为参数，而不是 jQuery 对象。 - Barmar

收集（collection）的起源是什么？通常使用jQuery时，您不需要创建自己的元素数组，因为jQuery对象已经为您创建了。 - charlietfl

要遍历一个数组，而不是 jQuery 对象中的元素，你需要使用 $.each(array, function...)，而不是 $(array).each(function...)。 - Barmar

好的...那就看你在推送什么了...jQuery对象还是dom元素。如果它们是jQuery对象，则不需要再用$()进行包装。 - charlietfl

Answer 1

Operationally（操作上）有点模糊，但这是$.each的实现方式。

each 实现

[].forEach() 最可能由每个浏览器的本地代码实现。

在没有进行性能测试的情况下，它们非常相似。尽管如果您可以完全删除jQuery，那么至少可以减少浏览器需要加载的几KB。

- dpix

Answer 2

对于您想要删除单个项目的特定情况，原始问题的评论很有帮助。

更一般地说，还有一些其他区别：

1）Array.forEach（）明显需要您遍历整个数组。jQuery方法将允许您遍历对象的属性。

2）jQuery.each（）允许短路计算。查看此帖子，其中提到使用“some（）”和“every（）”来执行纯js类似的操作：

如何像调用break一样短路Array.forEach？

- Eric

Answer 3

就性能而言，它们都很相似 Perf test

forEach 在浏览器中原生实现，这使得非jQuery开发人员更容易维护，而另一方面，each 提供了更好的可读性。

- Tal

Answer 4

Array.forEach 是一种遍历本地 Javascript 数组的方法。

jQuery collection.each 是由 jQuery 团队手动实现的迭代方法。jQuery 集合不是一个数组。

当 jQuery 刚出现时，这也更相关，因为 Array.forEach 没有在任何浏览器中实现。

- Andy Ray

---

你刚才是根据标题回答的吗？ - Ry-

这个回答如何解决问题？ - charlietfl