Javascript 从简单模块模式到RequireJS AMD的迁移

我在Javascript应用程序中使用模块模式，我想迁移到RequireJS和AMD

我当前的实现如下所示：

// Module main : Module.js
var myModule = (function(my, $, undefined) {
    'use strict';

    var m_privateMembers;
    var m_stuff = new my.Pear({color:"green"});

    //---------------------------------------

    function privateFunctions(args) {
    }

    //-----------------------------------

    my.publicFunctions = function(args) {
    };

    return my;
})(myModule || {}, jQuery);



// Module class Fruit : Module.Fruit.js
var myModule = (function(my, $, undefined) {
    'use strict';

    my.Fruit = Object.makeSubclass();

    my.Fruit.prototype._init = function() {

    };

    my.Fruit.prototype.someClassFunction = function() {
    };

    return my;
})(myModule || {}, jQuery);


// Module class Pear : Module.Pear.js
var myModule = (function(my, $, undefined) {
    'use strict';

    my.Pear = Fruit.makeSubclass();

    my.Pear.prototype._init = function(args) {
        this.m_someClassMember = args;
    };

    my.Pear.prototype.someClassFunction = function() {
    };

    return my;
})(myModule || {}, jQuery);

在我的index.html中，我使用脚本html标记来包含我的不同模块文件，一切正常

我的问题是:

1/为什么RequireJS系统比这个多脚本标签系统更好？

使用我当前的RequireJS方法：

define(['jquery'], function($) {

    var myModule = (function(my, $, undefined) {
        'use strict';

        var m_privateMembers;
        var m_stuff = new my.Pear({color:"green"});

        //---------------------------------------

        function privateFunctions(args) {
        }

        //-----------------------------------

        my.publicFunctions = function(args) {
        };

        return my;
    })(myModule || {}, $);

    return myModule;
});

2/我如何迁移到RequireJS模块，并保持我的实际模块提供的嵌入子类的单例模式？

显然有几个问题：

2.1/*m_stuff无法实例化my.Pear，我不知道如何使用require将模块拆分到多个文件中*

2.2/如果我有另外两个模块都依赖于myModule，那么myModule变量是否会是这些模块中的同一个实例（因为myModule不再在全局范围内）

编辑：此快速模式说明了我需要在更复杂的框架中执行的操作：

为什么RequireJS系统比这个多脚本标签系统更好

我不会详细讨论这个问题，但只要看看您现有的模块设置，您就会发现AMD将不再需要显式的脚本排序和为名称空间分配内容。RequireJS构建工具还将负责为生产准备脚本

你可以读更多

• 为什么使用Web模块-
• 你能帮我吗 了解require.js的好处？-

我怎样才能迁移到RequireJS模块并保持单例模式 我的实际模块为嵌入式子类提供的模式

让我们以水果和梨为例来了解这一点

当使用

require

或

define

时，您已经创建了一个封装所有逻辑的闭包，因此无需在其中创建另一个闭包。保持简单

// Fruit.js
define(['jquery'], function($) {
    'use strict';

    var Fruit = Object.makeSubclass();

    Fruit.prototype._init = function() {

    };

    Fruit.prototype.someClassFunction = function() {

    };

    return Fruit;
});

// Pear.js
define(['jquery', 'path/to/Fruit'], function($, Fruit) {
    'use strict';

    var Pear = Fruit.makeSubclass();

    Pear.prototype._init = function(args) {
        this.m_someClassMember = args;
    };

    Pear.prototype.someClassFunction = function() {

    };

    return Pear;
});

我不知道如何用require将模块拆分成几个文件

本质上，只需将“类”或模块分解为单独的AMD模块，并在需要时明确定义依赖项。从上面的示例可以看出Pear将如何使用水果模块

如果我有另外两个模块都依赖于myModule，那么 myModule变量必须与这些模块中的实例相同（因为myModule 不在全球范围内了吗

---

一旦您需要一个模块并加载了它，那么其他模块对它的任何其他引用都将得到相同的实例。因此，让您的模块返回构造函数并允许其他模块在必要时实例化它通常是最佳做法。

现在我的头脑中更清楚了，我还不太明白的最后一件事是，我是否正确地在模块中使用了相同的返回变量，将它们包装在一个公共名称空间中，但它可以很好地工作。AMD不需要使用名称空间。这样做的目的是将所有内容都保存在不涉及全局范围的模块中。如果我在一个框架中使用多个大型应用程序，我倾向于将其拆分为模块集合或模块库。我不能在同一个平面逻辑层次结构上有数百个模块（或者我应该？）。一组模块将处理水果逻辑，另一组模块将处理完全不同的任务，如应用程序外的消息传递等。我还需要在其他应用程序中重复使用部分模块，例如消息传递库。实际上，我需要的是一个C++命名空间，每个LIB中都有一个单独的插件，当然，我的LIB插件和/或其他LIBS模块都使用了我的LIB模块。这将允许使用与名称空间相同的组织