2012-10-09 6 views
6

Pytanie wywołane ciekawością, jeśli mam następujący kod, jaka jest korzyść (poza prostotą) wywoływania właściwości poprzez this zamiast user w metodzie show_name?JavaScript 'this' versus nazwa obiektu

var user = { 

    name : 'John Doe', 

    show_name : function(){ 

     alert(this.name); 

     // OR 

     alert(user.name); 
    } 
}; 
+2

Zauważ, że mogą wystąpić inne efekty uboczne przy użyciu 'this':' user.show_name.call (null); ' – David

Odpowiedz

10

Różnica staje się oczywista, jeśli spojrzeć na ten przykład. Tworzy drugi obiekt i odpowiednio ustawia prototyp.

var user = { 

    name : 'John Doe', 

    show_name : function(){ 

     alert(this.name); 

     // OR 

     alert(user.name); 
    } 
}; 

user2 = Object.create(user); 
user2.name = "someone else"; 

user2.show_name(); 

Tutaj this.name odnosi się do bieżącego obiektu name nieruchomości, natomiast user.name zawsze odnosi się do pierwotnego name nieruchomości.

5

Za pomocą this można upewnić się, że po zmianie nazwy zmiennej np. od user do something Twój kod nadal działa.

Poza tym, wyobrażam sobie, że (w niektórych przeglądarkach) może również występować pewien wzrost wydajności, ponieważ z przeglądarką user.name przeglądarka musi szukać kontekstu poza twoją funkcją przy używaniu this.name przylega do bieżącego kontekstu.

+0

Wow, to całkiem prosta odpowiedź. Dzięki. – Fluidbyte

+0

W jaki sposób odniesienie "tego" do "użytkownika" zapewnia, że ​​możemy zmienić "imię" na "coś". Czy nie oznacza to, że możemy zmienić "użytkownika" na "coś"? –

+0

@Jacob - dobry połów - oczywiście chciałem napisać 'user' not' name'. – WTK

3

Możesz używać tej samej funkcji w wielu miejscach i mieć to w kontekście.

function foo() { 
    alert(this.name); 
} 

var a = { alert: foo, name: "A" }; 
var b = { alert: foo, name: "B" }; 
a.alert(); 
b.alert(); 
0

Jeśli robisz wiele kopii obiektu, trzeba this więc można odwołać obecną obect. Używanie nazwy odwołuje się do domyślnego obiektu, a nie do kopii, z którą pracujesz.

0

W JavaScript this zawsze odnosi się do "owner" funkcji, którą wykonujemy, lub raczej do obiektu, którego funkcją jest metoda. Kiedy określamy naszą wierną funkcję na stronie, jej właścicielem jest strona, a raczej obiekt okna (lub obiekt globalny) JavaScript. Właściwość onclick jest jednak własnością elementu HTML, do którego należy.

Używanie this jest bardziej zalecane niż function name z oczywistych powodów.

+0

Stwierdzenie "zawsze odnosi się do" właściciela "funkcji" jest nieprawidłowe. Wartość "this" funkcji jest ustalana w całości przez wywołanie funkcji (lub przez * bind *) i może być ustawiona na dowolny obiekt lub dowolną wartość w trybie ścisłym ES5. – RobG

0

this tutaj określa, że ​​obiekt jest częścią obecna nazwa miejsca i jest dostępny wewnątrz obiektu .. pozwala przypuszczać swoje imię przedmiotem zmian od user do newUser nie będzie jakąkolwiek zależność i usunąć wszelkie problemy sprzęgła ..

2

Niezależnie od tego, czy używasz this, czy nazwa funkcji zależy od sposobu wywołania funkcji.

funkcją jest wartość this ustala, w jaki sposób funkcja jest wywoływana lub wiążą, więc jeśli funkcja będzie zawsze nazywane jako metoda odpowiedniego obiektu, użyj this. Ale jeśli można to nazwać w inny sposób, lub this powinien odnosić się tylko do konkretnego obiektu, użyj albo bind lub nazwy obiektu.

np.biorąc pod uwagę przykład OP, należy rozważyć:

var x = user.showName; 
x(); 

W powyższym showName nazywa bez jego ustawienie this, więc domyślnie globalnego obiektu i this.name wewnątrz funkcji będzie prawdopodobnie nie być czego oczekuje.

Zmiana nazwy funkcji nie jest szczególnie uciążliwym problemem, biorąc pod uwagę dostępność rozsądnie wydajnych funkcji wyszukiwania i zamiany w edytorach tekstu.

Nawiasem mówiąc, to pytanie jest często zadawane. Nie ma "poprawnej" odpowiedzi, tylko porady, jak dokonywać wyborów w niektórych przypadkach.