Question

我构建了一个模块foo，其中包含以下行：

MainModule.prototype = new Parent();
var bar = new MainModule();

该模块是使用requirejs构建的，因为它依赖于其他一些模块。

在我的新模块中，我希望能够访问foo中的一些变量/函数，因为它们公开了我的新模型想要访问的服务，如：

require(["foo"], function(foo){
  console.log(foo, MainModule, bar)
})

当我这样做时，我得到"undefined" ...我猜这与变量MainModule和bar在构建步骤中已经被证实的事实有关。我怎样才能防止这种情况发生？有没有办法指定必须保留的变量名？

Answer 1

好吧，我不确定foo是如何构造的，但MainModule和bar可能是foo中的局部变量。你可以从foo返回它们，例如：

define(function(require) {
    var MainModule = require('MainModule');
    var bar = new MainModule();
    var someFunction = function() {
        console.log('bar');
    };

    return {
        bar: bar,
        someFunction: someFunction
    }
});

然后你就可以访问返回的数据了：

require(["foo"], function(foo) {
    console.log(foo.bar);
    console.log(foo.someFunction());
})

Answer 2

问题中的问题与缩小无关，因为问题中显示的代码无法工作，无论是否缩小。

问题是必须导出模块外部应该可访问的值。在模块外部，可以通过require或define函数绑定此模块的变量访问它们。

要导出值，您可以从传递给define的工厂函数返回它们。（还有其他方法可以做到这一点，但我现在不打算进入它们。）你的foo.js文件可能是这样的：

define(function () {

function Parent() {
}

function MainModule() {
}

MainModule.prototype = new Parent();
var bar = new MainModule();

// Here I'm exporting the values I want accessible outside.
return {
    MainModule: MainModule,
    bar: bar
};

});

我显然必须使用最少量的代码填充foo.js以获得可行的功能。

然后你可以这样index.html：

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/xhtml; charset=utf-8"/>
    <script type="text/javascript" src="js/require.js"></script>
  </head>
  <body>
    <script>
      require.config({
          baseUrl: "./js",
      });
      require(["foo"], function(foo){
          console.log(foo, foo.MainModule, foo.bar)
      });
    </script>
  </body>
</html>

且foo.js和RequireJS位于js子目录（相对于index.html），您将在控制台上看到foo，foo.MainModule，并定义了foo.bar。 require调用加载名为foo的模块，该模块解析为js/foo.js，并将模块工厂返回的值绑定到传递给require的回调的第一个参数。在这种情况下，此参数的名称为foo。所以在回调中，

foo是整个模块，
foo.MainModule具有MainModule在模块foo中的值。
foo.bar具有bar在模块foo中的值。

最后两个绑定的存在只是因为模块foo导出其值，如上所示。

如何从使用requireJS构建的模块中访问变量？

2 个答案: