对象属性最初返回undefined，但在重新定义返回预期值

Question

我有建立这样的JavaScript对象：

var Dashboard = { 
    form: { 
    action: function(){ 
     return $('#upload_form').attr('action'); 
    }(), 
    //snip (more functions) 
    } 
} 

如果我叫（在WinXP使用Chrome 17）Dashboard.form.action在Chrome控制台后加载页面（我查了脚本和功能有）的结果是undefined，但是，如果我再使用相同的功能重新定义Dashboard.form.action：

Dashboard.form.action = function(){ 
    return $('#upload_form').attr('action'); 
}(); 

，并随后调用它，它按预期工作！

我在做什么错？这是一个错误，还是我只是在推崇它？

Answer 1

更新：

重新下方的评论：

实际上是我想要做的是结果赋给action属性...

在你的问题说：

如果我打电话... Dashboard.form.action ...

这使得它看起来像你期待action是一个函数（你不要“调用”非函数）。

如果您希望它是一个字符串（来自#upload_form的“action”属性值），则根本不需要使用函数。但你做需要确保你在做#upload_form元素已经存在于DOM中。

要么这么做，要么将您的脚本放在标记下面（anywhere below很好; just before or just after the closing </body> tag工作正常），要么将您的脚本包装在ready调用中。

所以，你的代码变为：这如果是后的#upload_form在标记：

var Dashboard = { 

    form : { 
     action : $('#upload_form').attr('action'), 

     //snip (more functions) 
    } 
}; 

...或者这个，如果你想使用ready（任何使用Dashboard将不得不等待别人直到ready为好）：

jQuery(function($) { 
    var Dashboard = { 

     form : { 
      action : $('#upload_form').attr('action'), 

      //snip (more functions) 
     } 
    }; 
}); 

注意，在第二种情况下，Dashboard将不再是一个全球变量。这是一个好事，但如果你需要它是全球出于某种原因，你可以将其导出：

jQuery(function($) { 
    var Dashboard = { 

     form : { 
      action : $('#upload_form').attr('action'), 

      //snip (more functions) 
     } 
    }; 

    // Export the global 
    window.Dashboard = Dashboard; 
}); 

只要确保没有尝试使用Dashboardready之前已经解雇。

---

原来的答复：

你有一个额外的对()：

action: function(){return $('#upload_form').attr('action');}() 
//            here -------^^ 

通过把他们那里，你通话立即功能，并指定结果称它为action属性。你只是想分配的功能本身的财产，所以不要把()末叫它：

action: function(){return $('#upload_form').attr('action');} 

这是正是你就不会在这里使用()同样的原因（让我们假设你有一个名为foo功能），如果你想f指foo：

var f = foo; 

如果说

var f = foo(); 

...你会是致电foo，不是指它。