require.js+backbone.js:如何构造具有初始化函数的模块

require.js + backbone.js: How to structure modules that have an initialize function?

本文关键字：初始化 函数 模块 何构造 js+backbone js require      更新时间：2024-05-17

我有一个有三个页面的应用程序（它们是单页面接口）。这些页面具有相似但不完全相同的功能。

因此，我希望拥有提供通用功能的javascript模块。然后，每个页面可以自定义/覆盖通用功能的部分。

我正在使用backbone.js，所以我所做的是：

  1. 加载包含常见模型、视图、集合等的文件
  2. 加载自定义/覆盖步骤1部分的应用程序特定文件
  3. 调用一个init（）函数，该函数用于实例化所有必需的模型/视图/集合

目前，我将模块存储在类似于以下内容的模块容器中：https://stackoverflow.com/a/9426071每个模块都有一个可选的init（）函数，由我的主init（）功能执行。

示例：

  1. 我有一个名为results.js的文件。它定义了搜索结果的通用模型/集合/视图。在它的init（）函数中，所有东西都被实例化，但这个函数还没有被调用：

    var resultView = new ResultView()

  2. 然后我包括myApp.js，并且视图的部分内容被覆盖。

  3. main init（）函数调用results.js init（），以初始化新视图。一切都很好，光滑，干燥

现在我想切换到require.js，而不是我自己的模块容器，并想知道如何组织我的代码。

我可以在myApp.js中安装所有模型/视图等，而不是每个模块的init（）函数。这意味着要有很多重复的代码。

或者，我可以坚持每个模块都有init（）函数，并在myApp.js中调用这些init（）功能。我不喜欢这样，因为我必须为我的三个页面中的每一个明确地写下我的模块三次：

require(['module1', 'module2', 'module3', ...],
  function(module1, module2, module3, ...) {
    var init = function() {
      module1.init();
      module2.init();
      module3.init();
      ...
    }
    return {init: init};
  }
);

对于10个模块加上一些库来说，这是不好的，而且很枯燥。有什么方法可以访问（循环）require.js持有的所有模块吗？

或者我遗漏了什么，我应该用不同的方式构建代码吗？

欢迎任何提示/想法，

Michael

正如上面的注释中所讨论的，通过使用函数体内的arguments对象对函数的参数进行循环，可以避免显式引用函数的参数。因此：

require(['module1', 'module2', 'module3', ..., 'moduleN'],
  function(module1, module2, module3, ..., moduleN) {
    var init = function() {
        module1.init();
        module2.init();
        module3.init();
        ...
        moduleN.init();
    };
    return {init: init};
});

成为：

require(['module1', 'module2', 'module3', ..., 'moduleN'],
  function() {
    var args = arguments;
    var init = function() {
        var module;
        for (module in args) {
            if (args.hasOwnProperty(module) && typeof module.init === 'function') {
                module.init.call(this);
            }
        }
    };
    return {init: init};
});

我在for in循环中添加了hasOwnProperty()检查，因为出于多种原因，这是一种很好的做法。此外，在尝试调用init之前，您会看到它是一个函数的显式检查

var args = arguments的原因是，您可以从内部函数引用它——否则，您将引用传递给init()的参数，这不是您想要的。

顺便说一句，在建筑层面上，我认为你所描述的项目结构非常好——我在很多非常大的项目中都使用了它，它从未让我失望。Require.js太棒了！：）

相关文章：