Question

我正在构建一个MVC Web应用程序，大量使用包含jQGrids和javascripts的ajax加载的部分视图。许多部分视图只包含2个div标签，其余部分是javascripts。

使用脚本标记使得一般页面结构对我来说更具逻辑性，因为javascripts是我看到的页面内容。

然而，jQGrid也使用了小的实用功能，比如格式化功能，我开始发现同名脚本执行几乎完全相同的任务的风险越来越大。

格式化功能示例：

    function primaryRoleFormatter(cellvalue, options, rowObject) {
        switch (cellvalue) {
            case "1":
                return "<%= Resource.PRIMARY %>";

            default:
                break;
        }

        return "";
    };

起初我看到格式化函数属于最近的网格，特别是因为可能有其他网格具有相同名称但在代码中有一些小差异的格式化函数。

我同时加载了两个或更多网格，似乎javascript足够聪明，可以使用当前脚本块中定义的脚本，如果有名称冲突，那么除了唠叨之外没有问题，“这是这样做的最佳方式是什么？“。

还有来自网格操作的ajax加载和显示jQuery对话框的脚本。我想这些脚本会随着时间的推移加起来。

我应该将脚本保留在使用它们的位置，还是应该尝试构建某种脚本库？

如果我将它们移到脚本文件中，那么分区函数（名称，类，文件......）的智能方法是什么？如果我把它们移出来，它们会被认为是更不引人注目的，因为这种类型的页面已经被ajax本身加载并且包含95％的javascripts吗？

我发现有类似的问题，但我找不到任何合适的答案。如果这有问题，我会删除它。

Answer 1

Object Literals

避免不必要地污染全局命名空间的最简单方法是将相关函数放在对象文字中：

var Formatter = {

    primaryRoleFormatter: function(cellvalue, options, rowObject) {
        switch (cellvalue) {
            case "1":
                return "<%= Resource.PRIMARY %>";
            default:
                break;
        }
        return "";
    },

    someOtherFormatter: function() {

    }
}

然后可以这样使用：

Formatter.primaryRoleFormatter(cellvalue, options, rowObject);
Formatter.someOtherFormatter();

这会导致全局对象上的一个属性，而不是您定义的每个函数的一个属性。

Module Pattern

或者你可以用功能范围隐藏东西：

var Formatter = (function() {

    function FormatterCtor() {
        // instance-ish level func
        this.onePerInstance = function() {}
    }

    // not accessible from the outside; not in the global namespace
    function privateFunction() {}

    // class-ish level func
    FormatterCtor.oneShared = function() {}

    return FormatterCtor;

})(); // self-executing

可以这样使用：

var fmt = new Formatter();
fmt.onePerInstance();

在任何一种情况下，你最终只能在全局命名空间中使用一个变量，这是一个胜利。

脚本组织模式（MVC + jQGrid）

1 个答案:

Object Literals

Module Pattern