Wie wird diese Variable in Javascript verwendet?

Diese Variable ist ein schwer fassbares Schlüsselwort in JavaScript. Wenn wir die entsprechenden Kenntnisse vollständig verstehen, können wir problemlos objektorientierte JavaScript-Programme schreiben.

Das Wichtigste an dieser Variable ist, klarstellen zu können, auf welches Objekt sie sich bezieht. Vielleicht gibt es für viele Informationen eine eigene Erklärung, aber einige Konzepte sind etwas kompliziert. Mein Verständnis ist: Analysieren Sie zuerst, welches Objekt die Funktion, in der sich this befindet, als Methode aufgerufen wird, und dann ist das Objekt das Objekt, auf das this verweist.
Beispiel 1,

var obj = {}; 
obj.x = 100; 
obj.y = function(){ alert( this.x ); }; 
obj.y(); //弹出 100

Dieser Code ist sehr einfach zu verstehen. Wenn obj.y() ausgeführt wird, wird die Funktion als Methode des Objekts obj aufgerufen, also im Funktionskörper zeigt auf das Objekt obj, sodass 100 angezeigt wird.

Beispiel 2.

var checkThis = function(){ 
alert( this.x); 
}; 
var x = 'this is a property of window'; 
var obj = {}; 
obj.x = 100; 
obj.y = function(){ alert( this.x ); }; 
obj.y(); //弹出 100 
checkThis(); //弹出 'this is a property of window'

Warum hier „Dies ist eine Eigenschaft von Fenster“ erscheint, kann etwas verwirrend sein. Im JavaScript-Variablenbereich gibt es die Regel, dass „globale Variablen Eigenschaften des Fensterobjekts sind“. Wenn checkThis() ausgeführt wird, entspricht es window.checkThis(). Daher wird zu diesem Zeitpunkt der Punkt des Schlüsselworts this in der Funktion checkThis zum Fensterobjekt, und da das Fensterobjekt über ein weiteres x-Attribut verfügt („thisis eine Eigenschaft von Fenster‘), daher wird „Dies ist eine Eigenschaft von Fenster“ angezeigt.
Die beiden oben genannten Beispiele sind relativ einfach zu verstehen, denn solange Sie bestimmen, welches Objekt die aktuelle Funktion als Methode aufruft (von welchem ​​Objekt aufgerufen wird), können Sie den Punkt der aktuellen Variable leicht bestimmen.

this.x und apply(), call()
Durch Aufruf und Anwenden können Sie die Ausführungsumgebung der Funktion neu definieren, dh den Punkt davon, der in einigen Fällen sehr häufig verwendet wird Anwendungen.
Beispiel 3: call()

function changeStyle( type , value ){ 
this.style[ type ] = value; 
} 
var one = document.getElementByIdx( 'one' ); 
changeStyle.call( one , 'fontSize' , '100px' ); 
changeStyle('fontSize' , '300px'); //出现错误，因为此时changeStyle中this引用的是window对象，而window并无style属性。

Beachten Sie, dass es in changeStyle.call() drei Parameter gibt. Der erste Parameter wird verwendet, um anzugeben, welches Objekt die Funktion sein soll angerufen. . Hier wird eins angegeben, was bedeutet, dass die Funktion „changeStyle“ von eins aufgerufen wird, sodass dieser Punkt im Funktionskörper das einzige Objekt ist. Der zweite und dritte Parameter entsprechen den beiden formalen Parametern Typ und Wert in der Funktion „changeStyle“. Der häufigste Effekt, den wir sehen, ist, dass die Schriftart des ersten Dom-Elements 20 Pixel groß wird.

Beispiel 4: apply()

function changeStyle( type , value ){ 
this.style[ type ] = value; 
} 
var one = document.getElementByIdx( 'one' ); 
changeStyle.apply( one , ['fontSize' , '100px' ]); 
changeStyle('fontSize' , '300px'); //出现错误，原因同示例三

Die Verwendung von apply ist ungefähr die gleiche wie die von call, mit dem einzigen Unterschied, dass apply nur zwei Parameter akzeptiert Der Parameter ist derselbe wie der Aufruf, der zweite Parameter muss ein Array sein und die Elemente im Array entsprechen den formalen Parametern der Funktion.

Dies in der Ereignisüberwachungsfunktion

var one = document.getElementByIdx( 'one' ); 
one.onclick = function(){ 
alert( this.innerHTML ); //this指向的是one元素，这点十分简单.. 
};

Hinweis: Globale Variablen in js werden der Instanz von Window dynamisch als Attribut hinzugefügt.

Das obige ist der detaillierte Inhalt vonWie wird diese Variable in Javascript verwendet?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!