Javascript范围问题，在一个匿名函数

我正在构建一个网站（个人），它根据url中使用的查询字符串向用户显示不同的内容。

例如page=home.html将显示home.html

该网站的JavaScript被包装对象内，包含不同的数据每个值，一些伪代码：

(function(){ 
    var wrapper = { 
     init: function(){ 
      //Runs on document ready 
      this.foo(); 
      this.nav.render(); 
     }, 
     foo: function(){ 
      //Some functionality goes here for the website, e.g. Display something from an API 
     }, 
     nav: { 
      //Functionality to handle the navigation, has different properties 
      config: { 
       //Contains the config for nav, e.g. page names + locations 
       dir: '/directory/to/content/', 
       pages: { 
        page_name: wrapper.nav.config.dir + 'page_value' 
       } 
      }, 
      render: function(){ 
       //some code 
      }, 
      routes: function(){ 
       //some code} 
      } 
     } 
    }; 

    $(function(){ 
     wrapper.init(); 
    }); 
})();

我的问题是，我想前面加上dir值每page值（在页面被定义的对象内部），期望得到directory/to/content/page_value的输出（在这个伪代码的情况下），但是dir是未定义的，当我试图访问它时，我试过了以下达到我想要的：

wrapper.nav.config.dir +“page_value”

我一直在最后30分钟试图找出什么我做错了，甚至还想过玩弄硬编码每个页面的URL。

想要做到这一点的原因是我的本地开发服务器和Web主机有不同的目录结构，所以我不想每次我想要开发+发布时重写URL。至于为什么一切都被包裹在一个物体中，我认为这样保持容易。

希望答案很简单，这只是一个业余的错误/缺乏理解。

来源

2012-01-07 Daniel

哪里是代码'wrapper.nav.config.dir +“page_value''行？这不在你上面的例子中。 – jfriend00 2012-01-07 21:33:45

这是我用来尝试和访问目录属性，没有成功 – Daniel 2012-01-07 21:47:09

我也编辑了问题，我试图使用它。 – Daniel 2012-01-07 21:53:35

问题是，您无法引用正在定义的变量。

因此，在wrapper的定义中，您不能参考wrapper。而且，在config的定义中，您不能参考config等等。

解决此问题的常用设计模式是尽可能多地初始化您的数据结构的声明，然后在.init()中执行其余的操作，当您可以自由访问所有数据结构时。

来源

2012-01-07 21:32:56 jfriend00

是的，只是一个错字 – Daniel 2012-01-07 21:46:25

好吧，假设你不想知道语法错别字（还有更多的问题），我已经更新了我的答案。 – jfriend00 2012-01-07 22:37:56

感谢您的更新，至于语法错别字，在实际的来源我没有在控制台中得到任何错误，所以我认为它是按预期工作。 – Daniel 2012-01-07 23:14:09

更改前两行：

var wrapper = null; 
(function(){ 
    wrapper = {

否则，包装是一个局部变量的匿名函数。

来源

2012-01-07 21:33:13 Krizz

将所有东西封装在一个匿名函数中的原因是我认为定义全局变量是不好的，但仍然做出更改，但仍然没有定义“包装器”。 – Daniel 2012-01-07 21:55:21

这与问题无关。如果OP需要访问匿名函数之外的包装，这可能是一个解决方案，但这根本不是问题的一部分。 – jfriend00 2012-01-07 22:38:51

@ jfriend00：“但是，当我尝试访问它时，dir未定义，我尝试了以下来实现我想要的操作”我认为这是因为包装在链接或其他方面实际上未定义。 – Krizz 2012-01-07 22:47:59

问题在于，当您询问其值时，仍然忙于定义包装器，这就是为什么它仍未定义。

下面的代码也会失败：

var x = { 
    y:"1", 
    z:x.y 
}

来源

2012-01-07 22:02:17 Johan

为什么不：

//... 
init: function(){ 
    //Runs on document ready 
    this.foo(); 
    var config = this.nav.config; 
    for (var page in config.pages) { 
     config.pages[page] = config.dir + config.pages[page]; 
    } 
}, 
//...

来源

2012-01-07 22:43:48

Javascript范围问题，在一个匿名函数

回答

相关问题