意外的IIFE执行顺序

Question

这是一个自学成功的JS黑客，并且试图做得更正式一些，因为我必须构建一个更好的JS应用程序，这个应用程序是名称间隔的，并且是一个更好的JS公民。我很感激我在这里做错了一些指示。

这个想法是使用第一个闭包来构造一个名称空间，然后在第二个我添加一个方法'类'构造函数的名称空间对象。我在子上调用一个方法。

(function() { 
 
    'use strict'; 
 
    /** 
 
    * @namespace ProjectX 
 
    */ 
 

 
    var ProjectX = { 
 

 
     attr1: 'I am inside ProjectX' 
 
     
 
    } 
 
    window.ProjectX = ProjectX; 
 

 
})() 
 

 
//console.log(ProjectX.attr1); // When this line is uncommented the code will output 'foobar' as expected? 
 

 
(function() { 
 
    'use strict'; 
 

 
    ProjectX.subObj = function(val) { 
 
     this.name = val; 
 
     return this; 
 
    }; 
 
})(); 
 

 

 
var subObj = new ProjectX.subObj('Foobar'); 
 
console.log(subObj.name);

我期待看到 'Foobar的' 在控制台日志。然而，这产生了在控制台下面的结果：

{ "message": "Uncaught TypeError: (intermediate value)(intermediate value)(intermediate value)(...) is not a function", "filename": " http://stacksnippets.net/js ", "lineno": 03, "colno": 1 }

当我读到这个代码，我希望这两个IIFE的将顺序执行，首先带来projectX创建于生活，那么，第二个加入进一步构造函数projectX创建该将返回一个subObj。此外，如果第16行的console.log（（ProjectX.attr1）未经注释，代码将按照我预期运行。这似乎表明，在我引用它之前，ProjectX实体不是“存在”的。我对IIFE的理解是，它们立即运行，无论如何，ProjectX不是构造函数 - 它是一个全局变量。

在研究中，我发现function inside of IIFE not recognized这似乎是一个类似的领土，但与绑定一个事件DOM并不与我的查询相似

Answer 1

在第一个IIFE之后缺少一个分号，当它的分号console.log被删除时该分号变得相关您可以搜索JS

中需要分号的情况

没有分号，你的代码可以解释为：在格式(IIFE)()()

(function() { 
    var ProjectX = { 
     attr1: 'I am inside ProjectX' 
    } 
    window.ProjectX = ProjectX; 
})()(function() { 
    ProjectX.subObj = function(val) { 
     this.name = val; 
     return this; 
    }; 
})(); 

检查下面的函数，这个工程因为IIFE返回一个函数，该函数被调用，('Hey')

(function() { 
 
     return function(msg){console.log(msg)} 
 
    })()('Hey')

没有分号，javascript期望您的第一个IIFE返回一个函数，而不是c与您的代码，所以它会抛出一个Type错误，说它期待一个函数，但得到了undefined。你的代码最终计算结果为：

undefined(function() { 
    ProjectX.subObj = function(val) { 
     this.name = val; 
     return this; 
    }; 
})(); 

或更简化为

undefined(<a function as parameter>)() 

，然后抛出一个function这里有望代替undefined错误。

阅读关于JavaScript中高阶函数的更多信息，以便更好地理解此语法以及您的代码是否模糊不清。