Das Prinzip und die Richtung von JavaScript

Wie lässt sich feststellen, worauf dies hinweist?

• ①Wenn es in der globalen Umgebung aufgerufen wird, zeigt es auf das Fenster.
• ② Als Methodenaufruf eines Objekts zeigt es auf dieses Objekt.
• ③Als Konstruktoraufruf zeigt es auf das neu erstellte Objekt.
• ④Sie können die Richtung mithilfe von „Apply“, „Call“ und „Bind“ ändern.
• ⑤Das this in der Pfeilfunktion ist an den Kontext gebunden, in dem es definiert ist, und kann nicht geändert werden. Das this der Pfeilfunktion zeigt auf das this der ersten Nicht-Pfeilfunktion, die ihm am nächsten liegt und in der äußeren Schicht gefunden wurde.

Wie ist dieses Prinzip zu verstehen?

Um JavaScript zu lernen, müssen Sie die folgenden zwei Schreibweisen verstehen:

var obj = {
  foo: Funktion () {}
};
 
var foo = obj.foo;
 
//Methode 1 schreiben obj.foo()
 
//Methode 2 schreiben foo()

Diese beiden Schreibweisen sind ein Funktionsaufruf und eine Objektmethode. Obwohl obj.foo und foo beide auf eine Funktion verweisen, können ihre Ausführungsergebnisse unterschiedlich sein. Sehen Sie sich den folgenden Code an:

var obj = {
  foo: Funktion () { konsole.log(diese.bar) },
  Takt: 1
};
 
var foo = obj.foo;
var Balken = 2;
 
obj.foo() // 1
foo() // 2

Warum sind die Laufergebnisse unterschiedlich? Da der Funktionskörper das Schlüsselwort this verwendet, erfahren Sie in vielen Lehrbüchern und Materialien, dass sich this auf die Umgebung bezieht, in der die Funktion ausgeführt wird. Bei obj.foo() wird foo in der obj-Umgebung ausgeführt, daher verweist dies auf obj; bei foo() wird foo in der globalen Umgebung ausgeführt, daher verweist dies auf die globale Umgebung. Daher sind die Betriebsergebnisse der beiden unterschiedlich.

Wie ermitteln Sie also, worauf dies hinweist? Oder in welcher Umgebung läuft dies?

var obj = { foo: 5 };

Der obige Code weist der Variablen obj ein Objekt zu. Die JavaScript-Engine generiert zuerst ein Objekt {foo: 5} im Speicher und weist dann obj die Adresse dieses Objekts zu.

obj ist eine variable Adresse. Beim Lesen von obj.foo wird zuerst die Speicheradresse von obj abgerufen, dann wird das Originalobjekt von dieser Adresse gelesen und das Attribut foo zurückgegeben.

Wie wird die Foo-Eigenschaft im Speicher gespeichert?

{
  foo: {
    [[Wert]]: 5
    [[schreibbar]]: wahr
    [[aufzählbar]]: wahr
    [[konfigurierbar]]: wahr
  }
}

Der Wert des foo-Attributs wird im Value-Attribut des Attributbeschreibungsobjekts gespeichert.

Was ist, wenn der Wert der Eigenschaft eine Funktion ist?

var obj = { foo: Funktion () {} };

Zu diesem Zeitpunkt speichert die JavaScript-Engine die Funktion separat im Speicher und weist dann die Adresse der Funktion dem Wertattribut des Foo-Attributs zu.

{
  foo: {
    [[Wert]]: Die Adresse der Funktion...
  }
}

Da eine Funktion separat im Speicher abgelegt wird, kann sie in unterschiedlichen Umgebungen (Kontexten) ausgeführt werden.

var f = Funktion () {};
var obj = { f: f };
 
// Führe f() alleine aus
 
// obj-Umgebung führt obj.f() aus

JavaScript ermöglicht es Ihnen, innerhalb eines Funktionskörpers auf andere Variablen in der aktuellen Umgebung zu verweisen.

var f = Funktion () {
  console.log(x);
};

Diese Funktion verwendet andere Variablen X.

Schauen Sie sich den Code unten an

var f = Funktion () {
  konsole.log(dies.x);
}
 
var x = 1;
var obj = {
  f: f,
  x: 2,
};
 
// Führe f() alleine aus // 1
 
// obj-Umgebung führt obj.f() aus // 2

Sie können sehen, dass die Ergebnisse der Funktionsausführung unterschiedlich sind. Funktion f wird global ausgeführt, was ist also mit diesem? this.x bezieht sich auf das x der globalen Umgebung.

Was obj.f betrifft, das in der obj-Umgebung ausgeführt wird, so befindet sich this offensichtlich in der obj-Umgebung, sodass this auf obj.x in der obj-Umgebung verweist.

Zu Beginn des Artikels findet obj.foo() foo über obj, sodass es in der obj-Umgebung ausgeführt wird. Sobald var foo = obj.foo, zeigt die Variable foo direkt auf die Funktion selbst, und die Funktion foo() selbst befindet sich in der globalen Umgebung, sodass foo() in der globalen Umgebung ausgeführt wird.

Funktion foo() {
    konsole.log(dieser.name);
}
 
Funktion Foo(fn) {
    fn();
}
 
var obj = {
    Name: 'zl',
    foo,
}
 
var name = "Ewig";
Foo(Objekt.foo);

Was ist also das Ergebnis der Ausführung des obigen Codes?

Dies ist das Ende dieses Artikels über das Prinzip und die detaillierte Erklärung von JavaScript this. Für relevantere JavaScript this-Inhalte suchen Sie bitte nach früheren Artikeln auf 123WORDPRESS.COM oder durchsuchen Sie die folgenden verwandten Artikel weiter. Ich hoffe, Sie werden 123WORDPRESS.COM in Zukunft unterstützen!