Question

我正在尝试使用Require.js模块化JavaScript应用程序。我正在试图弄清楚如何处理应用程序中使用的全局变量。我读到的所有内容都表明Require.js的一个要点是摆脱全球变量。无论如何，我有这样的互动：

function myFunction()
{
  // Access some dynamic variables here
}

$('#myButton').on('click', myFunction());

mySettings = {};

$('#myForm').on('submit', function()
{
  mySettings.someSetting = "someValue";

  $.ajax(....) // Send the mySettings to some PHP script
}

总而言之，该应用程序是交互式的，用户在页面上执行的一些控件和操作必须能够访问全局可访问的变量和值，并且必须能够与它们进行交互并执行操作。

如果没有全局变量，我该怎么做？

Answer 1

Check out this answer first

您需要在settings.js文件中创建一个单例，如下所示：

(function(){

    define([], function(){

        var settings = {

        };

        return {
            GetSettings: function() { return settings; }
       };
    });

})();

然后将其包含在您的模块中

define(['./settings'], function(settings){

    var mySettings = settings.GetSettings();

});

然而！我建议使用像Angular，Ember或Durandle这样的框架 - 它们提供了更好的方法来处理这种情况

Answer 2

创建settings模块：

define(function () {
     return {
         settingA: "some value",
         settingB: true,
         settingC: {a: 1, b: 2, c: 3}
     };
});

如果要在全局范围内使用settings模块，我会以名称settings使其可用，而不是使用相对路径。所以我把它放在RequireJS配置中：

paths: {
    "settings": "path/to/the/actual/settings"
}

然后要求它：

define(["settings"], function (mySettings) {
    function myFunction()
    {
      // Access some dynamic variables here
    }

    $('#myButton').on('click', myFunction());

    $('#myForm').on('submit', function()
    {
      mySettings.someSetting = "someValue";

      $.ajax(....) // Send the mySettings to some PHP script
    }
});

这是完成这项工作的基本方法。

Require.js如何处理全局变量？

2 个答案: