Question

我正在遍历DOM元素的集合。每次迭代都会多次使用helper()函数：

$(".myclass").each(function() {
    var arg;
    helper();
    // do stuff
    function helper() {
        // do helpful stuff with arg
    }
});

如上所述在helper()块中包含function()函数是不好的做法？我应该使用：

$(".myclass").each(function() {
    var arg;
    helper(arg);
    // do stuff
});
function helper(arg) {
    // do helpful stuff with arg
}

在第一个示例中，每个匹配的.myclass元素在内存中都有自己的helper函数实例吗？

修改：如果有人正在寻找答案的正确解释 - http://net.tutsplus.com/tutorials/javascript-ajax/stop-nesting-functions-but-not-all-of-them/

Answer 1

您在第一个示例中创建了helper函数的实例，而在第二个示例中，只有一个实例用于所有迭代。

因此，为避免创建多个相同的函数，您可以在第一个示例中内联代码或使用第二种方法。

Answer 2

是的，这将一遍又一遍地重新声明该功能（每次循环运行时）。

你可以将函数放在更高的范围内，就像你的第二个例子一样，或者如果你想保持范围更清晰，你可以围绕函数做一个闭包（尽管这有关于外部时的含义）闭包执行，执行多少次等等：

$(...).each((function() {

    var helper = function(arg) {
        //do helpful stuff with arg
    }

    return function() {
        var arg;
        helper(arg);
        //do stuff
    };

}());

请注意，这仍然有可能不止一次定义助手，而不是每次迭代。

是否建议将函数放在.each（）中？

2 个答案: