JavaScript 自执行函数 - 有什么区别？

Question

我通过使用 jQuery 非常熟悉自执行函数。

(function($) { /* do stuff */ })(jQuery);

今天我正在阅读backbone.js 源代码，注意到他们这样做：

(function() { /* do stuff */ }).call(this);

这实现了同样的事情吗？下面的两行代码会做同样的事情吗？

(function($) { /* do stuff */ })(jQuery);
(function($) { /* do stuff */ }).call(jQuery);

Answer 1

第一种形式是传入参数，而第二种形式是在执行函数中设置“this”所指的内容。他们是不同的。

(function(x){ console.log(this,x); })( jQuery );
//--> [window object]
//--> [jQuery object]

(function(x){ console.log(this,x); }).call( jQuery );
//--> [jQuery object]
//--> undefined

(function(x){ console.log(this,x); }).call( jQuery, jQuery );
//--> [jQuery object]
//--> [jQuery object]

有关更多信息，请参阅 Function.prototype.call< /code>和 Function.prototype.apply。

这是您可能想要使用 call 技术的情况

v = 'oh noes!'
var o = {
  v : 42,
  f : function(){
    console.log(this.v);
    (function(){ console.log(this.v) })();
  }
};
o.f();
// --> 42
// --> 'oh noes!'

：通过 call() 获取 this 的值，自调用函数在 Global（窗口）范围内调用，而不是当前对象。

Answer 2

在他们的例子中：

(function() { /* do stuff */ }).call(this);

...他们确保使用 this 的特定值调用该函数（例如，函数中的 this 与 this 相同） code>this 在函数之外）。

在您的情况下：

(function($) { /* do stuff */ })(jQuery);

...您的函数中的 this 将是全局对象，因为您调用它时没有执行任何设置 this 的操作，因此 this 默认为全局对象（window，在浏览器上）。

在 JavaScript 中，this 完全由函数的调用方式设置。有两种主要方法：

1. 通过调用函数作为从对象属性检索函数的表达式的一部分，例如

   obj.foo(); // 或者 `obj["foo"]();
   

   在这种情况下，在对 foo 的调用中，this 将引用 obj。

2. 通过内置的 call 调用该函数 或 应用 方法：

   var obj = {name: "Fred"};
   函数 foo(称呼、标点符号) {
       Alert(称呼 + " " + this.name + 标点符号);
   }
   foo.call(obj, "嗨", "!"); // 提醒“嗨弗雷德！”
   foo.apply(obj, ["嗨", "!"]); // 还提醒“嗨弗雷德！”
   

   call 和 apply 之间的唯一区别在于如何指定要传递到正在调用的函数中的参数：使用 call，您可以只需将它们作为离散参数列出在您想要的 this 值后面即可；使用apply，您可以将它们作为数组提供。

Answer 3

第一个将 jQuery 作为参数 $ 传递。第二个使 jQuery 成为函数内的“this”变量。

Answer 4

.call 将函数置于闭包作用域中。

因此，如果您这样做：

(function($) { /* do stuff */ }).call(jQuery);

$ 将是 undefined