包含可以互相访问的对象的 JavaScript 函数

Question

我最初有如下代码，其中全局命名空间中没有任何内容，并且我能够从 obj1 调用 obj2 中的函数，反之亦然。一切都很好。

(function() {
    var obj1 = {
        obj1_f1 : function() {
        },
        obj1_f2 : function() {
            obj2.obj2_f1();
        }
    };
    var obj2 = {
        obj2_f1 : function() {
            obj1.obj1_f1();
        },
        obj2_f2 : function() {
        }
    };
    $(document).ready(function () {
        obj1_f1();
    });
})();

但是现在我需要从全局上下文中调用 obj1 对象中的函数，所以我必须引入一个全局对象:

var com_mycompany_make_sure_unique = new function() {
    // use 'this.' so that obj1 is not in the global namespace
    this.obj1 = {
        obj1_f1 : function() {
        },
        obj1_f2 : function() {
            com_mycompany_make_sure_unique.obj2.obj2_f2();
        }
    };
    this.obj2 = {
        obj2_f1 : function() {
            com_mycompany_make_sure_unique.obj1.obj1_f1();
        },
        obj2_f2 : function() {
        }
    };

    $(document).ready(function () {
        com_mycompany_make_sure_unique.obj1.obj1_f1();
    });
};

但我对此并不太满意 - 当跨 obj1 和 obj2 调用函数时，我必须在所有函数调用前面加上我的全局对象名称。我想我错过了一个技巧。

感谢您的帮助，

保罗

Answer 1

你可以这样做(见评论):

var com_mycompany_make_sure_unique = function() {
    // Continue using variables as you were before
    var obj1 = {
        obj1_f1 : function() {
        },
        obj1_f2 : function() {
            obj2.obj2_f2();
        }
    };
    var obj2 = {
        obj2_f1 : function() {
            obj1.obj1_f1();
        },
        obj2_f2 : function() {
        }
    };

    $(document).ready(function () {
        obj1.obj1_f1();
    });

    // Return an object that can be used via the `com_mycompany_make_sure_unique` variable
    return {
        obj1: obj1,
        obj2: obj2
    };
}();

这有时被称为“显示模块模式”，因为外部匿名作用域函数内的所有内容都是私有(private)的，然后您通过将它们放在返回的对象上来“显示”您想要显示的部分。例如，如果您只需要公开 obj1，而不是 obj2，您可以这样做:

return {
    obj1: obj1
};

<小时/>

不过，我的问题是为什么需要从全局上下文中调用函数？使用现代事件处理和像 RequireJS 这样的异步模块定义加载器，您真正需要的唯一全局(呃)是 AMD 函数。

<小时/>

旁注:我用 var ... = function() { ... }() 替换了您的 var ... = new function() { ... }; ; 这里没有必要使用 new ，这样做可能会让人们感到困惑(并为生成的对象提供一个不需要的额外原型(prototype))。但是如果您愿意，您可以使用原始形式，只需将结尾更改为

this.obj1 = obj1;
this.obj2 = obj2;

...而不是返回一个对象。