Question

我正在尝试使用模块化命名空间模式，它允许我扩展各种命名空间中可用的功能，并在多个文件中定义它们。这是我正在使用的模式;

var Namespace = Namespace || {};

Namespace.SubSpace = (function () {
    var subspace = {};

    subspace.Func = function () {
        return "My Function";
    };

    return subspace;
})();

如何在定义之前使命名空间功能可用？换句话说，如果不依赖于已经解析过的函数声明，我怎么能调用Namespace.SubSpace.Func()？

Answer 1

我可以通过使用类似于JQuery的ready()函数的方法来解决我的问题。但是，它确实依赖于在其他任何东西之前定义根命名空间。根命名空间还包括允许注册回调的功能。

var Namespace = (function () {

    var namespace = {};
    namespace.ReadyCallbacks = [];

    namespace.Ready = function (callback, queueJump) {
        if (queueJump)
            namespace.ReadyCallbacks.unshift(callback);
        else
            namespace.ReadyCallbacks.push(callback);
    };

    namespace.Begin = function () {
        for (x = 0; x < namespace.ReadyCallbacks.length; x++) {
            namespace.ReadyCallbacks[x]();
        }
    };

    return namespace;
})();

重要的是，这可以区分应该在其他人之前运行的回调。这允许框架模块在执行用户脚本之前定义子命名空间和函数。（即使首先加载用户脚本）。

用户脚本

Namespace.Ready(function () {
    console.log(Namespace.SubSpace.Func()); // prints "Module 1"
});

框架模块

Namespace.Ready(function () {
    Namespace.SubSpace = (function () {
        var subspace = {};

        subspace.Func = function () {
            return "Module 1";
        };

        return subspace;
    })();
}, true);

最后，调用Namespace.Begin()以正确的顺序执行所有操作。此外，由于我正在使用JQuery，我可以将其包装在$(document).ready()。

中

我对javascript并不十分精通，所以我不确定这种方法是多么“正确”，我欢迎评论＆amp;建议。

Javascript模块化命名空间模式

1 个答案: