So behalten Sie den \'this\'-Zeiger in verschachtelten JavaScript-Funktionen bei

JavaScript „this“-Zeiger in verschachtelten Funktionen

In JavaScript kann der Wert des „this“-Zeigers bei der Arbeit mit verschachtelten Funktionen verwirrend sein Funktionen. Entgegen den Erwartungen kann der Aufruf einer verschachtelten Funktion den „this“-Zeiger dem globalen „window“-Objekt und nicht der umschließenden Funktion zuweisen.

Bedenken Sie den folgenden Code:

<code class="javascript">var std_obj = {
  options: { rows: 0, cols: 0 },
  activeEffect: "none",
  displayMe: function() {
    // this refers to std_obj
    if (this.activeEffect == "fade") { }

    var doSomeEffects = function() {
      // this unexpectedly refers to the window object
      if (this.activeEffect == "fade") { }
    };

    doSomeEffects();
  }
};

std_obj.displayMe();</code>

In this Szenario: Wenn die verschachtelte Funktion doSomeEffects aufgerufen wird, zeigt der „this“-Zeiger auf das „window“-Objekt, obwohl es im Bereich von std_obj deklariert ist. Dies liegt daran, dass JavaScript den „this“-Zeiger basierend darauf bestimmt, wie die Funktion aufgerufen wird.

In diesem Fall wird doSomeEffects ohne ein führendes übergeordnetes Objekt aufgerufen, was zum globalen Objekt führt (normalerweise das „window“-Objekt). ) wird „diesem“ zugeordnet. Um dieses Problem zu beheben, können drei Methoden verwendet werden:

1. Rufen Sie die Funktion mit der Aufrufmethode auf:

   <code class="javascript">doSomeEffects.call(std_obj);</code>

2. Wenden Sie die Funktion mit der Apply-Methode an:

   <code class="javascript">doSomeEffects.apply(std_obj, []);</code>

3. Erstellen Sie eine gebundene Funktion:

   <code class="javascript">var boundDoSomeEffects = doSomeEffects.bind(std_obj);
   boundDoSomeEffects();</code>

Das obige ist der detaillierte Inhalt vonSo behalten Sie den \'this\'-Zeiger in verschachtelten JavaScript-Funktionen bei. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!