jQuery.proxy() wykorzystanie

Question

Czytałem api o jQuery.proxy(). Wygląda obiecująco, ale zastanawiałem się, w jakiej sytuacji najlepiej skorzystać. Czy ktoś może mnie oświecić?

Answer 1

Aby uzyskać funkcję o wartości this powiązanej z określonym obiektem. Na przykład w wywołaniach zwrotnych, takich jak programy obsługi zdarzeń, wywołania zwrotne AJAX, limity czasu, odstępy czasu, obiekty niestandardowe itp.

To tylko wymyślny przykład sytuacji, w której może być przydatny. Zakładając, że istnieje obiekt Person, który ma nazwę właściwości. Jest również połączony z elementem wprowadzania tekstu, a ilekroć wartość wejściowa się zmienia, nazwa w tym obiekcie osoby również jest aktualizowana.

function Person(el) { 
    this.name = ''; 

    $(el).change(function(event) { 
     // Want to update this.name of the Person object, 
     // but can't because this here refers to the element 
     // that triggered the change event. 
    }); 
} 

Jednym z rozwiązań, które często wykorzystują to, aby zapisać ten kontekst w zmiennej i używać wewnątrz funkcji wywołania zwrotnego, takich jak:

function Person(el) { 
    this.name = ''; 

    var self = this; // store reference to this 

    $(el).change(function(event) { 
     self.name = this.value; // captures self in a closure 
    }); 
} 

Ewentualnie moglibyśmy korzystać jQuery.proxy tu więc odniesienia do this odnosi się do obiektu Osoby zamiast elementu, który wywołał zdarzenie.

function Person(el) { 
    this.name = ''; 

    $(el).change(jQuery.proxy(function(event) { 
     this.name = event.target.value; 
    }, this)); 
} 

Zauważ, że funkcja ta została unormowana w ECMAScript 5, która obejmuje obecnie metodę bind pożyczoną od prototypejs i jest już dostępny w niektórych przeglądarkach.

function Person(el) { 
    this.name = ''; 

    $(el).change(function(event) { 
     this.name = event.target.value; 
    }.bind(this)); // we're binding the function to the object of person 
} 

Answer 2

Na przykład, jeśli chcesz utworzyć połączenia zwrotne. Zamiast:

var that = this; 

$('button').click(function() { 
    that.someMethod(); 
}); 

można zrobić:

$('button').click($.proxy(this.someMethod, this)); 

Lub jeśli stworzyć plugin, który akceptuje wywołania zwrotne i trzeba ustawić określony kontekst zwrotnego.

Answer 3

To tylko skrótowym metoda ustawiania kontekstu dla zamknięcia, na przykład:

$(".myClass").click(function() { 
    setTimeout(function() { 
    alert(this); //window 
    }, 1000); 
}); 

Jednak często chcemy this pozostać taka sama jak metoda byliśmy w, która $.proxy() jest używany do, jak to:

$("button").click(function() { 
    setTimeout($.proxy(function() { 
    alert(this); //button 
    }, this), 1000); 
});​ 

Zwykle jest używany do połączeń opóźnionych lub w dowolnym miejscu, w którym nie chce się stosować metody longhandowej deklaracji zamknięcia. Sznurkowa metoda wskazywania kontekstu do obiektu ... cóż, nie znalazłem jeszcze praktycznego zastosowania w codziennym kodzie, ale jestem pewien, że istnieją aplikacje, zależy to tylko od struktury obiektu/zdarzenia.