如何在 JavaScript 中返回对象字面量答案

【问题标题】：How to return object literal in JavaScript如何在 JavaScript 中返回对象字面量
【发布时间】：2013-10-17 21:09:02
【问题描述】：

我正在尝试将 JavaScript 对象文字包装在自执行匿名函数中。下面的第一个代码示例可以正常工作，但第二个不能，我不确定为什么？

作品：

(function(){
    return MyApp = {
        init: function() {
            console.log('MyApp init');
        }
    }
})();

不起作用：

(function(){
    var MyApp = {
        init: function() {
            console.log('MyApp init');
        }
    }
    return MyApp;
})();

据我了解，SEAF 应该执行并立即返回。这就是为什么第一个示例返回 MyApp 作为我可以与之交互的对象的原因。我认为将 MyApp 分配给 SEAF 内的变量然后返回它会做同样的事情，但在：

Uncaught ReferenceError: MyApp is not defined

为什么？

【问题讨论】：

在您的第一个示例中，您将结果分配给名为“MyApp”的全局变量。在第二种情况下，您将变量分配给名为“MyApp”的闭包局部变量。您必须在某处分配闭包执行的结果，否则它会丢失。
Your code works just fine 假设您捕获了返回值。
正如 zzzzBov 指出的那样，如果你输入var someName = (theClosureExecution)，它就可以正常工作

标签： javascript namespaces object-literal

【解决方案1】：

由于您的 SEAF 的结果（最好命名为 IEFE）没有在任何地方使用，因此函数返回什么并不重要。现在比较

(function(){
    MyApp = {…}
})();

与

(function(){
    var MyApp = {…}
})();

不同之处在于，在第二个函数中，您的变量前面有一个 var keyword，这使其成为 IEFE 的本地变量，而在第一个函数中，它是一个隐式全局变量（您应该避免这样做）。这样，第二个 sn-p 不会分配给全局范围内的任何内容，并且稍后从外部访问 MyApp 将失败并出现错误。

最好返回一些值，然后分配给全局声明的变量：

var MyApp = (function(){
    return {…};
})();

【讨论】：

如果我使用它来命名我的 JavaScript 代码，返回一个对象字面量是实现单例模式的最佳方式，因为我真的只想要一个应用程序实例在任何给定时间可用？
是的，可能。如果模块中没有任何局部变量，则可以省略 IEFE；它不一定是对象字面量，但您可以使用任何方式创建对象。

【解决方案2】：

您的第一个示例所做的是将 MyApp 设置为全局变量 - 因为变量 MyApp 前面没有 var 关键字或点符号，所以它变成了全局变量。如果您将 MyApp 放入自执行函数中，这听起来对您来说实际上不是问题 - 您实际上可以从中删除 return 语句 - 甚至在同一函数中定义其他全局变量。您永远不会引用顶级函数的结果，因此没有使用 return。

您的第二个示例使用var 将MyApp 设置为局部变量，因此它仅在运行它的函数的上下文中可见。

【讨论】：

【解决方案3】：

使用箭头函数的解决方案：

var myApp = (() => {
    return {
        init: () => console.log('MyApp init')
    };    
})();
myApp.init();

解释：

全局变量myApp 设置为IIFE (Immediately-invoked Function Expression) 的结果。
init 也可以写成箭头函数。
如果箭头函数在 return 语句之前没有执行其他逻辑，并且返回一个对象字面量，则可以进一步简化。要从箭头函数返回对象字面量，请将其括在括号中：

var myApp = (
   () => ({
       init: () => console.log('MyApp init')
   })
)();

【讨论】：