Javascript闭包返回undefined

Javascript closure is returning undefined

本文关键字：undefined 返回 闭包 Javascript      更新时间：2023-09-26

我继承了一个代码库，我需要为我的工作更新。我正在慢慢地了解他们试图用关闭来完成什么，但是当我试图更新使用这个功能的网站的一部分时，我被卡住了。我将给出代码试图完成的基本轮廓，看看是否有人可以提供帮助。

var TheObject = (function (){
    var veryLargeDependantData = {
        var1: {}, 
        var2: {}, 
        var3: [],
        //Set these variables via functions
        function1: function f1(data){...}, 
        function2: function f2(data){...}, 
        initialize: function initialize() { //set values for var1... var3}
     };
     return {initialize: veryLargeDependentData.initialize};
})().initialize();

因为我显然不能在网站上显示生产代码，这将不得不做。但是基本上，veryLargeDependentData变量是函数的入口。当页面加载时，它调用initialize函数，一切正常。但现在我需要将其添加到旧页面的onclick事件中，firebug控制台表示该变量未定义。在其他页面中，我可以毫无问题地使用它。

我的问题是，是什么魔法导致闭包不是这样的可调用命名空间的一部分。我有点javascript nOOb所以我道歉，如果这个问题听起来误导。

onclick='TheObject.initialize();'

我认为您的意思是要在单击事件处理程序中运行initialize函数，并且您目前正在尝试这样做:

TheObject.initialize();

如果是这种情况，问题是TheObject实际上指的是initialize的返回值，因为您在立即调用的函数表达式的返回值上调用了initialize。而且很有可能initialize返回undefined(很可能，它没有显式的return语句)。

要解决这个问题，您可能需要删除对initalize的立即调用，这将允许您在页面加载和其他任何地方使用上面所示的行。

在此代码中，TheObject的值将是veryLargeDependentData.initialize()方法返回的值。如果initialize方法没有返回任何值，则TheObject为undefined。

一个简化的例子:

var TheObject = (function () {
  return {
    initialize: function () { 
      // stuff happens here, but importantly, there's nothing returned
    }
  }
})().initialize();

您可以将其分解为以下执行顺序:

// the value of step_one is a function that will return an object when it is run
var step_one = (function () {
  return {
    initialize: function () {
      // ...
    }
  }
});
// after running the function step_one, step_two will be an object
// containing one key - initialize - which is a function
var step_two = step_one();
// since initialize doesn't return anything, TheObject is set to undefined.
var TheObject = step_two.initialize();

你可以通过将TheObject设置为包含initialize方法的对象，然后在需要时再次运行该方法来解决这个问题。

var TheObject = (function () {
  return {
    initialize: function () {
    }
  }
})();
// initialize
TheObject.initialize();
// and again
TheObject.initialize();

请注意!

原作者可能希望initialize方法只运行一次。多次运行它可能会给系统带来bug !

似乎没有必要复杂，我不确定在这种情况下使用匿名函数和闭包获得了什么。有什么原因让你不能简单地做到以下几点吗?

var TheObject = {
    var1: {}, 
    var2: {}, 
    var3: [],
    //Set these variables via functions
    function1: function(data){...}, 
    function2: function(data){...}, 
    initialize: function(){alert("initialize");}
};
var initButton = document.getElementById("initButtonName");
initButton.addEventListener("click", TheObject.initialize);

请注意，您需要删除内联事件。

相关文章：