javascript - `_.forEach` 和 `$.each` 的区别

Question

这两个函数 _.forEach和$.each分别取自underscore和jQuery似乎做同样的事情。

偏好一种实现而不是另一种实现的可能原因是什么？

Answer 1

_.forEach并且$.each传递给回调的参数不同。

如果使用_.forEach，传递给回调的第一个参数是值，而不是键。
因此，如果您根本不关心您应该使用的密钥_.forEach。

其他区别：

1. _.forEach它会更快一些，因为它Arrray.prototype.forEach在现代浏览器中使用本机。
2. 这个值也不同。jQuery 的行为不遵循标准，下划线的行为。

Answer 2

它们都主要为IE8 中不可用的forEach功能提供替代品。

如果您遍历数组，它们不会增加太多。

除了回调参数的顺序之外，主要区别在于，在 jQuery 中，该值也可用作回调调用的上下文（这就是为什么值不太重要，只是提供的第二个参数的原因）。除非您真的想避免将参数传递给函数，否则这并不是喜欢它的主要原因：

var product = 1;
$.each([1, 2, 3], function(){ product *= this });

大多数情况下，您不使用这两个库，因此您只需使用您拥有的库提供的迭代函数。

如果您碰巧同时导入了这两个库，我建议您使用下划线函数作为

• 它与数组上的标准 ECMAScript 函数最相似，因此您可以更轻松地在 IE8 死掉的那一天进行迁移
• 它更有效，因为它在可用时使用本机功能：

见源：

...
if (nativeForEach && obj.forEach === nativeForEach) {
     obj.forEach(iterator, context);
...

Answer 3

jQuery看起来像：

something.each( function(index, Element) )

下划线看起来像：

_.each(list, function(Element, index, list), [context])
// or
_(list).each(function(Element, index, list), [context])

本机 array.forEach看起来像：

array.forEach(function(Element, index, list), [context])

所以：

• 下划线保持与本机相同的参数顺序forEach
• JQuery 和 Underscore 的实现有两个区别：
  • JQuery 设置this为Element、native 和 Underscore 允许您提供自己的上下文
  • Native 和 underscore 还提供列表本身作为回调的第三个参数。

---

编辑：为什么能够设置上下文很有用？

考虑一下你有某种对象：

var worker = new FooWorker();
worker.process(something);
worker.process(somethingElse);

假设您想对数组中的每个值调用该方法。
使用 context 参数，您可以简单地说：

myArray.forEach(worker.process, worker);

如果没有它，您需要更详细（并且每个元素再调用一次函数）：

// native
myArray.forEach( function(i, e) {worker.process(e);} );
// jquery
$(myArray).each( function() {worker.process(this); } );

这是 JQuery 的 foreaching 约定使事情变得不那么方便的一种情况。