Question

我在我的Javascript应用程序中使用Module Pattern，我想迁移到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，我不知道如何在需要的几个文件中拆分模块？*

2.2 / 如果我有两个其他模块都依赖于myModule，那么myModule var将是那些模块中的同一个实例（因为myModule不再在全局范围内）？

编辑：这个快速架构在一个更复杂的框架中说明了我需要做的事情：

schema

Answer 1

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

我不会深入讨论这个问题，但只是从查看现有的模块设置，您可以看到AMD将无需显式脚本排序并将内容分配给命名空间。 RequireJS构建工具也会为生产准备脚本。

您可以阅读更多

为什么选择网络模块 - http://requirejs.org/docs/why.html
你能帮助我吗？了解require.js的好处？ - https://gist.github.com/desandro/4686136

我如何迁移到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将如何使用Fruit模块。

如果我有两个其他模块都依赖于myModule，那么 myModule var是那些模块中的相同实例（因为myModule 是不是在全球范围内了？）

一旦你需要一个模块并且它被加载，那么从其他模块对它的任何其他引用将获得相同的实例。出于这个原因，通常最好让模块返回一个构造函数，并允许其他模块在必要时实例化它。

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

1 个答案: