这两个不同的JavaScript声明的目的是什么？

Question

我想我已经想到了这一点，但我希望能够解释清楚 - 这两个javascript片段之间的区别究竟是什么？

;Person1 = (function() {
  var FirstName = 'Hello';
  var LastName = 'World';
  this.sayHello = function() {
    alert(FirstName + ' ' + LastName);
  };
});

;Person2 = (function() {
  var FirstName = 'Hello';
  var LastName = 'World';
  this.sayHello = function() {
    alert(FirstName + ' ' + LastName);
  };
})();

一个是用（）执行的; 最后，另一个不是。 当我执行新的Person1（）。sayHello（）或new Person2（）时，它们都按预期执行.sowHello（）; - 他们留下的是什么？ 据我所知，后者是一个关闭，它是由浏览器阅读时执行的，但我还没有完全理解其含义。 谢谢你的帮助！

更新：我错误地在Person2闭包中遗漏了return关键字。 然而，我并没有解决这个问题，因为答案非常有助于描述这样做的含义:)

Answer 1

Person1是一种相当标准的对象构造函数，意味着用new调用。 new Person1()创建一个新对象，并在该对象上创建一个sayHello方法。

Person2正在立即执行，这会导致一些问题！ 在评估Person2 ，将调用该函数（在全局上下文中）。 在该函数的执行中， this将是window对象。 执行的函数不返回任何内容，因此Person2最终未定义：

>>> Person2 = (function() { var FirstName = 'Hello' // ...}; })(); 
>>> console.log(window.sayHello, Person2);
function() undefined

一个new Person2()导致了一个TypeError “Person2不是一个构造函数”。 如果稍微更改一下，可以使Person2闭包返回一个带有函数的对象：

;Person2 = (function() {
  var FirstName = 'Hello';
  var LastName = 'World';
  return {
    sayHello: function() {
      alert(FirstName + ' ' + LastName);
    }
  };
})();

Person2.sayHello();

或者让它返回一个函数（所以你可以使用new Person2() ）：

;Person2 = (function() {
  var FirstName = 'Hello';
  var LastName = 'World';
  return function() {
    this.sayHello = function() {
      alert(FirstName + ' ' + LastName);
    };
  };
})();

Answer 2

第一个定义函数内联， Person1保存对它的引用。

第二个相当于不采取任何行动。 你正在定义一个内联函数并立即执行它。 由于函数不返回任何内容，因此Person2未定义。

这两个例子的行为都不像你描述的那样，所以也许你输错了你的例子？

Answer 3

自调用函数背后的主要动机是避免污染全局命名空间。 您可能有兴趣查看以下资源以供进一步阅读：

• JavaScript模式中的一周：自我调用
• Stack Overflow：JavaScript习语：只创建一个函数来调用它