使用 Razor 语法的 Javascript 命名空间？

Question

我在嵌入 .cshtml 文件(部分 View )的脚本片段中经常使用这种“Javascript 命名空间”模式:

<script type="text/javascript">
    (function (MyNamespace) {
        MyNamespace.PublicFunc1 = function (p1, p2) {
            localFunc1('abc');
            MyNamespace.PublicFunc2(p1, p2, 'abc');
        }

        MyNamespace.PublicFunc2 = function (p1, p2, p3) {
            // ...
        }

        localFunc1(p1) {
            // ...
        }
    }(window.MyNamespace = window.MyNamespace || {}));
</script>

它就像一个魅力，我可以从该脚本片段外部调用这些 MyNamespace.PublicFunc1 和 MyNamespace.PublicFunc2 函数。

当需要同时渲染两个或多个部分 View 时，就会出现问题，因此任何调用 MyNamespace.PublicFunc1 的外部 JS 代码将不再能够这样做，因为该函数会有两个或多个实例。

为了解决这个问题，我尝试通过 Razor 语法对这些脚本使用服务器端唯一的命名空间 ID/名称，即:

@{
    // server-side variable with a unique namespace identifier/name
    string _namespace = Model.MyUniqueNamespace;
}

<script type="text/javascript">
    (function (@_namespace) {
        @_namespace.PublicFunc1 = function (p1, p2) {
            @_namespace.PublicFunc2(p1, p2, 'abc');
        }

        @_namespace.PublicFunc2 = function (p1, p2, p3) {
            // ...
        }

        localFunc1(p1) {
          // ...
        }
    }(window.@_namespace = window.@_namespace || {}));
</script>

这种方法的问题在于整个 @_namespace.PublicFunc1 部分由 Razor 和服务器端处理——这是有道理的，但不是我需要的；我只需要 @_namespace 部分作为服务器端，而它周围的其他所有内容都作为客户端/JS。

我的问题是:

1. 有没有办法使用 Razor 语法来解决这个问题？
2. 是否有另一种/更好的方法来处理这些场景(通过 Javascript 魔法)，而不必编写成熟的 JS 插件/小部件/库(对于每个这样的本地化/特定于页面的脚本片段来说似乎太多了) ？

Answer 1

将其更改为 @(_namespace) 应该可以解决问题 1。对于问题 2，需要注意的是，您传递到函数中的变量名称并不...真的...事情。即:

(function(foo) {
  foo.func1 = function() { ... }
})(window.bar = window.bar || {});

这仍然会设置window.bar.func1。