JavaScript Self Executing Functions - Jaka jest różnica?

Question

Jestem bardzo obeznana z funkcjami samoczynnego wykonywania z pracy z jQuery.

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

Dzisiaj czytałem źródło backbone.js i zauważyłem, że robią to:

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

Czy to osiągnąć to samo? Czy następujące 2 linie kodu robią to samo?

Answer 1

Pierwsza forma przechodzi przez parametr, podczas gdy druga forma ustawia to, co "to" odnosi się do funkcji wykonującej. Oni są różni.

(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] 

Aby uzyskać więcej informacji, zobacz Function.prototype.call i Function.prototype.apply.

Oto przypadek, gdzie może chcesz użyć call technika:

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

bez ustawiania wartości this poprzez call() funkcja self-wywołanie jest wywoływany w zakresie (oknie) Globalnego , a nie bieżący obiekt.

Answer 2

W ich przypadku:

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

... oni upewniając się, że funkcja jest wywoływana z określonej wartości dla this (np this wewnątrz funkcji będą takie same jak this z zewnątrz funkcjonować).

W twoim przypadku:

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

... this obrębie funkcja zostanie globalny obiekt, ponieważ pan nazwał, nie robiąc nic, określający this, a więc this domyślnie globalnego obiektu (window, na browers).

W JavaScript, this jest ustalany w całości przez sposób wywołania funkcji. Istnieją dwa główne sposoby:

1. Wywołanie funkcji jako części wyrażenia pobierającego ją z właściwości obiektu, np.

   obj.foo(); // Or `obj["foo"](); 
   

   W takim przypadku, w ramach wezwania do foo, this skieruje do obj.

2. poprzez wywołanie funkcji za pomocą wbudowanego w call lub apply metod:

   var obj = {name: "Fred"}; 
   function foo(salutation, punctuation) { 
       alert(salutation + " " + this.name + punctuation); 
   } 
   foo.call(obj, "Hi", "!"); // alerts "Hi Fred!" 
   foo.apply(obj, ["Hi", "!"]); // Also alerts "Hi Fred!" 
   

   Jedyną różnicą między call i apply sposób można określić argumenty przekazać do funkcji jesteś wywołującego: Z call , po prostu podajesz je jako dyskretne argumenty po wartości, którą chcesz; z apply, podajesz je jako tablicę.

Answer 3

.call umieszcza funkcję w zakresie zamknięcia.

Więc jeśli to zrobił:

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

$ byłoby undefined

Answer 4

Pierwszy przechodzi jQuery jako parametr $. Drugi powoduje, że jQuery jest "tą" zmienną wewnątrz funkcji.