在requirejs中共享实例化对象

时间:2012-09-11 02:22:42

标签: javascript requirejs

我定义了一个模块Foo,我在另一个模块Bar中实例化它。我有第三个模块Other,我想提供Foo创建和修改Bar的同一个实例。

define('Foo', [], function() {
    var test = function() {
        this.foo = 'foo';        
    };

    return test;
});

define('Bar', ['Foo'], function(Foo) {
    Foo = new Foo();
    Foo.bar = 'bar';
    console.log('From bar', Foo);
});

define('Other', ['Foo'], function(Foo) {
    console.log('From the other', Foo);
});


require(['Foo', 'Bar', 'Other'], function(Foo, Bar, Other) {
    console.log('Bringing it all together');
});

http://jsfiddle.net/radu/Zhyx9/

没有要求,我会做类似的事情:

App = {};

App.Foo = function() {
    this.foo = 'foo';
}

App.Bar = function() {
    App.Foo = new App.Foo();
    App.Foo.bar = 'bar';
    console.log('From bar', App.Foo);
}

App.Other = function() {
   console.log('From other', App.Foo);
}

App.Bar();
App.Other();

http://jsfiddle.net/radu/eqxaA/

我知道我必须在这里遗漏一些东西,因为这是我在requirejs中的第一次尝试,可能存在某种误解。这个例子可能看起来很人为但我在制作项目时遇到了类似的问题使用Backbone和RequireJS。

3 个答案:

答案 0 :(得分:3)

使用return从模块公开的内容可以从需求模块中代表该模块的参数访问

Here's your demo, modified

define('Bar', ['Foo'], function(Foo) {
    Foo = new Foo();
    Foo.bar = 'bar';

    //return instantiated Foo
    return Foo;
});


require(['Foo', 'Bar', 'Other'], function(Foo, Bar, Other) {
    //Bar is the instantiated Foo, exposed from Bar
    console.log(Bar);
});

答案 1 :(得分:1)

模块的返回值是requirejs考虑暴露的api。 所以你的console.log陈述正在破坏这一点。

您需要从函数中返回一些内容,如下所示:

define('Bar', ['Foo'], function(Foo) {
    var Bar = { my: 'bar'};
    //or maybe return a function or whatever 
    return Bar;
 });

答案 2 :(得分:1)

我发布此评论作为其中一个答案,但我知道我可以像这样分享一个实例:

define('Foo', [], function() {
    var test = function() {
        this.foo = 'foo';        
    };

    return new test();
});

define('Bar', ['Foo'], function(Foo) {
    Foo.bar = 'bar';
    console.log('From bar', Foo);
});

define('Other', ['Foo'], function(Foo) {
    Foo.other = 'other';
    console.log('From the other', Foo);
});


require(['Foo', 'Bar', 'Other'], function(Foo, Bar, Other) {
    console.log('Bringing it all together');
});

http://jsfiddle.net/radu/XEL6S/

但是,我首先没有这样做的原因是Foo模块无法实例化自身,因为它需要DOM准备就绪。但是,作为RequireJS的新手,我不知道this sort of functionality is built in。换句话说,要像我上面指定的那样共享模块Foo的实例,请在其定义中实例化并添加requireJS文档中指定的domReady模块。