Question

这两种JavaScript模式非常相似。我想知道哪一个更好，为什么以及如何改进它们。

第一种方法：

"MODULE" in window || (window.MODULE = {} );

MODULE.utils = (function ($) {

    var utils = {};

    //public
    utils.todo = function() {
        //#
    }

    //private
    function init() {
        //#
    }

    init();

    return utils;
}(jQuery));

第二种方法：

"MODULE" in window || (window.MODULE = {} );

MODULE.utils = (function() {

    function todo(){
        //#
    }

    function init() {
        //#
    }

    return {
        init:init
    }

})();


$(function() {
    MODULE.utils.init();
});

Answer 1

你的两种选择都没有太多的利弊，更多的是个人偏好。两者都可以调整，以提供更好的范围。

我有自己的偏好，它依赖于Underscore。它并没有真正促进私有变量或功能，但我很少发现这是一个问题。如果你想引入jQuery等，最好将一个匿名函数包装到$实际上jQuery（或一个可互换的库）。

正如您在下面看到的那样，我的偏好需要更多的代码才能让您前进（虽然其中一些不是必需的），但尝试了一些您最初提议的变体，我＆＃ 39;我发现我的解决方案有助于更易理解的代码，其他开发人员更容易掌握所发生的事情，特别是如果他们有{{1}的经验}。

编辑：包含在一个匿名函数中，以演示集成jQuery和受保护的范围。

Backbone.View

Answer 2

"MODULE" in window || (window.MODULE = {} );

为什么这样？我们已经在全球范围内了，对，我们可以做到：

var MODULE = MODULE || {};

除此之外，第一个示例init中唯一真正的区别（风格除外）是立即从“模块”中调用的，而在第二个示例中，您手动调用init稍后的某个时间点（即使在此情况下模块加载后立即）。因此，如果您需要将呼叫延迟到init，则第二个更可取;如果你想让它立即发生，第一个是更好的（除了关于风格的偏好）。

Answer 3

第二种方法假设名为$的变量是一个接受单个参数的函数，该参数也是一个函数 - 可能是$ == jQuery的假设。这可能并非总是如此。在第一种方法中，您保证模块范围内的$ == jQuery，因为您将其作为参数传递给初始化模块的匿名函数。

除此之外，两者之间没有太大区别。我更喜欢第二种方法来公开公共方法，这样我的语法对于公共和私有方法看起来都是一样的，所以我必须明确指定哪些方法是公共的。但这只是风格。

这两种JavaScript模式之间有哪些优点和缺点？

3 个答案: