Question

我正在将JSF繁重的Web应用程序迁移到REST，主要是JS模块应用程序。

我看过Nicholas Zakas在YUI影院播放的“可扩展的javascript应用程序架构”（精彩视频），我实施了大部分演讲并取得了成功，但我有一些问题：

我发现讲座在模块和沙箱之间的关系上有点混乱，一方面，根据我的理解，模块不应该受到沙盒之外发生的事情的影响，这就是他们发布事件的原因通过沙箱（而不是通过核心，因为核心是用于隐藏基础库）但应用程序中的每个模块都有一个新的沙箱？沙盒是否应该将事件限制为使用它的modoules，还是应该跨页面发布事件？例如：如果我有两个可编辑的表，但我想在不同的沙箱中包含每个表，它的事件只影响该沙箱中的模块，比如每个表的消息框，这是一个不同的模块/小部件，我怎么能用沙箱做对于每个模块，我当然可以使用moduleid为事件添加前缀但是会创建我想要避免的耦合......我不想将模块打包为每个组合的一个模块，因为我已经有6-7个模块。< / p>
虽然我可以为像id选择器等小东西隐藏基础库。我仍然希望使用基础库来进行模块依赖和资源加载，并使用像YUI loader或dojo.require之类的东西，所以实际上我正在隐藏基础库，但模块本身是由基础库定义和加载的......对我来说似乎有点奇怪。
库不会返回简单的js对象，但通常会将它们包装起来，例如：您可以执行类似$$（'。classname'）的操作。每个（...清理代码很多，包装基础然后在模块中通过执行.each创建基本库的依赖是没有意义的但是没有使用这些功能会导致很多代码被编写出来而被遗漏......并且实现该功能非常容易出错。
有没有人有建立此订单前端堆栈的经验？使用yui数据表但使用dojo进行表单验证更改基础库和/或使用不同库中的模块是多么容易...？
如果你选择像我说的那样做并且通过YUI加载器加载dojo表单验证小部件来表示dojocore是一个模块并且表单模块依赖于它，那么2 + 4的某种组合可能是什么？

感谢。

Answer 1

我们在应用程序中大量使用此模式。查看Stoyan Stefanov的书籍 JavaScript Patterns ，详细了解如何实现Sandbox模式。基本上它看起来像这样：

(function (global) {
    var Sandbox = function fn (modules, callback) {
        var installedModules = Sandbox.modules,
            i = 0,
            len = modules.length;

        if (!(this instanceof fn)) {
            return new fn(modules, callback);
        }

        // modules is an array in this instance:
        for (; i < len; i++) {
            installedModules[modules[i]](this);
        }

        callback(this);
    };

    Sandbox.modules = {};
    global.Sandbox = Sandbox;

})(this);

// Example module:
// You extend the current sandbox instance with new functions
Sandbox.modules.ajax = function(sandbox) {
    sandbox.ajax = $.ajax;

    sandbox.json = $.getJSON;
};

// Example of running your code in the sandbox on some page:
Sandbox(['ajax'], function(sandbox) {

    sandbox.ajax({
        type: 'post',
        url: '/Sample/Url',
        success: function(response) {
            // success code here. remember this ajax maps back to $.ajax
        }
    });

});

Javascript自包含沙箱事件和客户端堆栈

1 个答案: