0

我正在努力让 requireJS 正常工作。Page 运行良好，但我认为我做事的方式非常错误。

例如，在页面 xzy 上，我在页面末尾添加了以下 JavaScript（JS 必须暂时保留在页面上，因此不可能有外部 js 文件）

<script type="text/javascript" language="javascript">
  //<![CDATA[
  (function () {
    require([
      'async!http://maps.google.com/maps/api/js?v=3&sensor=false',
      'maps/jquery.ui.map.full.min.js',
      'maps/jquery.ui.map.extensions.min'
      ], function() {

        // ... do stuff with Google Maps

      }
    );
  }());
//]]>
</script>

这样做会使google.map方法$.().gmap全局可用，而这可能不应该全局可用。

问题：
我应该把它转换成 requireJS 模块吗？为什么？

如果是这样，该模块是否也可以在其他页面上使用，还是我只是在第 123 页“重新定义”并且依赖文件已经被缓存？

最后 - 我是否必须将我的 require 调用中的代码转换为 module.methods，然后我通过调用module_name.method_name(pass_some_parameters)？

4

1 回答 1

2

只看JS：

http://maps.google.com/maps/api/js?v=3&sensor=false

你可以看到这window.google是一个全球性的。如果没有 Google 发布 AMD 版本，您将无能为力。

您是否应该创建一个模块的决定首先应该是 JS 代码的可读性/可维护性的问题。模块是（应该）、可读、可重用的代码块/可重用抽象，其余代码可以使用。您还应该从中获得测试好处 - 每个模块都应该更容易单独测试。

如果您选择模块化方法，您最终可能会得到更多的 JS 文件，并且您可能认为这会导致性能问题 - 即多个 HTTP 请求。但这可以通过使用RequireJS 优化器将您的模块优化为单个文件来缓解。

如果您转换为模块，是的，您可以require从其他页面进行转换，并且如果您的 HTTP 缓存标头已设置，则浏览器可能会选择使用缓存版本，从而为您节省 HTTP 请求（如果您使用相同的缓存试探法）已将每个模块优化为一个文件）。

如果您重新定义（我假设您的意思是复制并粘贴代码块），那么调用中列出的那些依赖项都require 应该由浏览器缓存，因此立即可用（取决于您的 Web 服务器及其 HTTP 缓存标头） .

最后，是的，您可能需要稍微重构代码以公开新模块的 API。如果这意味着使用方法公开单个对象，那么这就是您应该做的。根据我的经验，这个过程几乎不可避免地会导致更好的代码。由于您必须更多地考虑模块的目的是什么，这通常会导致您破坏代码段之间的耦合。

于 2013-04-25T12:40:20.370 回答