Heim >Web-Frontend >js-Tutorial >Wie verhält sich das JavaScript-Schlüsselwort „this' in verschiedenen Funktionsaufrufkontexten?

Wie verhält sich das JavaScript-Schlüsselwort „this' in verschiedenen Funktionsaufrufkontexten?

Barbara Streisand
Barbara StreisandOriginal
2024-12-14 15:16:14448Durchsuche

How Does the JavaScript `this` Keyword Behave in Different Function Invocation Contexts?

Enthüllung der Dynamik des Schlüsselworts „this“ in Funktionen

Im Bereich JavaScript ist das Schlüsselwort „this“ von großer Bedeutung beim Umgang mit Funktionen. Sein Wert hängt vom verwendeten Aufrufmuster ab.

Aufrufmuster

JavaScript-Funktionen können auf vier verschiedene Arten aufgerufen werden:

  1. Als Methode:
    Wenn eine Funktion als Methode eines Objekts aufgerufen wird, „dies“ bezieht sich auf das Objekt selbst. Beispiel:

    const foo = {
      bar() {
        console.log(this); // Logs "foo"
      }
    };
    foo.bar();
  2. Als Funktion:
    Wenn eine Funktion als eigenständige Entität aufgerufen wird, ist „this“ standardmäßig das globale Objekt (normalerweise). „Fenster“ in Browsern). Beispiel:

    function bar() {
      console.log(this); // Logs "Window" (global object)
    }
    bar();
  3. Als Konstruktor (mit dem Schlüsselwort „new“):
    Wenn eine Funktion mit dem Schlüsselwort „new“ aufgerufen wird, a Es wird ein neues Objekt erstellt und „this“ bezieht sich auf dieses Objekt. Beispiel:

    function Constructor() {
      this.property = "value";
    }
    const instance = new Constructor();
    console.log(instance.property); // Logs "value"
  4. Mit der Methode „apply“:
    Die Methode „apply“ ermöglicht die Anpassung des Werts „this“ durch Übergabe eines Objekt. Beispiel:

    function bar(a, b) {
      console.log(this); // Logs "obj"
      console.log(a); // Logs "1"
      console.log(b); // Logs "2"
    }
    const obj = {
      a: 1,
      b: 2
    };
    bar.apply(obj);

Implikationen für verschachtelte Funktionen und Rückrufe

In verschachtelten Funktionen und Rückrufen bestimmt das Aufrufmuster der übergeordneten Funktion die Wert von „this“ in der verschachtelten Funktion. Wenn die übergeordnete Funktion als Methode aufgerufen wird, bezieht sich „this“ auf das Objekt; Wenn es als Funktion aufgerufen wird, verweist es auf das globale Objekt. Um den gewünschten Wert von „this“ in Rückrufen beizubehalten, werden Techniken wie Bindungsfunktionen oder die Verwendung von Pfeilfunktionen eingesetzt.

Das obige ist der detaillierte Inhalt vonWie verhält sich das JavaScript-Schlüsselwort „this' in verschiedenen Funktionsaufrufkontexten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn