JQuery .each():匿名函数的性能如何?

4

我有一个小的理论性能问题:

如果我有以下内容:

$(".somediv").each(function() {
   // perform some heavy stuff here
});

如果我将匿名函数的代码重构为命名函数,执行代码会不会更快:

f = function() {
   // perform some heavy stuff here
};

$(".somediv").each(f);

一些不合理的疑虑告诉我,也许匿名函数在每次循环中都会重新创建?

2
无理疑虑是不合理的。 - Roest
这就是像http://jsperf.com/这样的工具旨在回答的问题。此外,答案可能会因浏览器而异! - clee
尝试将你的“在这里进行一些重型操作”中不需要的内容从循环中删除,例如已声明的变量应放在循环外。你提到的两个选项之间没有太大的区别。 - Clinton Ward
4个回答

3
如果您关心性能,那么不应使用.each()。使用for循环或while循环迭代集合的内容并且没有任何函数调用比使用.each()及其每个项目的结果函数调用快得多。
回答您的问题,匿名函数与命名函数的速度没有区别。差异在运行时之前在解析时解决。 这个jsPerf显示普通的for循环比.each()快近10倍:http://jsperf.com/each-vs-for-loop-mine

你可以指出一些关于在解析时而不是运行时解决这些差异的参考资料吗? 那么,这个答案会有意义吗?(https://dev59.com/GXVD5IYBdhLWcg3wHn2d#81329) - Alvaro

1

让我们考虑一下这段代码(jquery 1.7.1):

// "public" each
each: function( callback, args ) {
    return jQuery.each( this, callback, args );
}

// "local" each
each: function( object, callback, args ) {
    // [...]

    if (args) {
        // [ args is for internal use ...]
    // A special, fast, case for the most common use of each
    } else {
        if (isObj) {
            for (name in object) {
                if (callback.call(object[name], name, object[name]) === false) {
                    break;
                }
            }
            // [...]

正如您所看到的,callback 被直接引用和使用。没有复制 callback 函数。然而,如果 jQuery 要复制函数,您建议的解决方法将在 jQuery 内部产生相同的行为。

注意:在 JavaScript 中,函数是对象。一个函数声明语法之所以与另一个不同,没有“不合理”的原因,唯一的区别是作用域。您建议的解决方法会使该函数成为全局函数,而另一个匿名函数是“本地”于 each 调用。


0

它不是重新创建的,而是创建一次并将引用传递给函数$.each()。然后该函数通过其引用调用匿名函数。

如果有区别,我认为它不足以证明使用除在其他人阅读您的代码时最容易理解的模式之外的不同模式。如果您的代码出现性能问题,请测量它并找到瓶颈。几乎肯定不是因为这样的事情。


0

在性能测试中不建议使用 console.log(),因为它的开销不保证是恒定的。 - jfriend00

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接