Qual è la differenza tra questo, l'auto, finestra e window.self

Question

Se apro una pagina vuota e ho eseguito il seguente comando in javascript console ottengo lo stesso risultato:

>>> this 
    DOMWindow 

    >>> self 
    DOMWindow 

    >>> window 
    DOMWindow 

    >>> window.self 
    DOMWindow 

Che cosa si riferiscono a ? ... lo stesso oggetto o cos'altro?

Answer 1

window è il riferimento alla finestra del browser corrente in cui viene eseguito lo script. window.self è ovviamente un'auto-riferimento di questo al suo interno. E poiché self qui è una proprietà dell'oggetto globale window, è possibile accedervi anche come se fosse una variabile "globale": solo self.

Quindi gli ultimi tre sono nella maggior parte delle circostanze davvero la stessa cosa.

this tuttavia è completamente diverso: è una variabile che punta allo scope corrente. Se si esegue il seguente codice nella console:

> var myPackage = {} 
> myPackage.method = function() {console.log(this)} 
> myPackage.method() 

this punterà all'oggetto myPackage (il campo di applicazione method).

Answer 2

this 
DOMWindow 

this è sempre il contesto reale un'espressione JavaScript è stato chiamato. Quindi nel tuo caso il suo contesto globale, che è l'oggetto finestra quando il vostro eseguirlo nel browser. Nota eseguire lo stesso in nodeJs ti darà un altro risultato.

self 
//DOMWindow 

From the MDN Docs:

Restituisce un riferimento a un oggetto all'oggetto finestra.

window 
// DOMWindow 

Il suo ciò che avete chiamato: l'oggetto finestra.

window.self 
//DOMWindow 

È lo stesso che chiamare se stessi sopra causa che il contesto è finestra. Quindi, chiamando lo window.self o solo self o this.self, quando sei nell'ambito globale, è lo stesso.

Answer 3

Sempre questa parola chiave si riferisce al contesto in cui è stata richiamata. Ma self e window anche dopo aver cambiato contesto si riferiscono a Window stessa.

// Log function 
function logAll(){ 
    console.log("this >", this); 
    console.log("self >", self); 
    console.log("window >", window); 
    console.log("window.self >", window.self); 
    console.log("this.self >", this.self); 
}; 

// Class Car 
function Car(){ 
    this.self = 6; 
}; 

// Instance of Car 
var honda = new Car(); 
honda.self = 5; 

// logAll() called in context Gloabal 
logAll(); 

// Outputs 
this > Window 
self > Window 
window > Window 
window.self > Window 
this.self > Window 

// logAll() called in context honda 
logAll.call(honda); 

// Outputs 
this > Car { self= 5 } 
self > Window 
window > Window 
window.self > Window 
this.self > 5 

Qui potete vedere this.self finestra rendimenti in quando viene chiamato in ambito globale, perché di portata globale

this = windows 
this.self = windows.self 
this.self = Windows 

Ma mentre si è nel contesto di Honda, un esempio di auto:

this = honda 
this.self = honda.self 
this.self = 5 

Il contesto gioca un ruolo importante in Javascript, mentre si lavora con OOP e ereditarietà.