Warum bezieht sich das auf die äußere Variable?

Question

Dies sollte das Objekt selbst beziehen, aber im folgenden Code, warum es anders verhält?

var x = 4, 
    obj = { 
     x: 3, 
     bar: function() { 
      var x = 2; 
      setTimeout(function() { 
       var x = 1; 
       alert(this.x); 
      }, 1000); 
     } 
    }; 
obj.bar(); 

Warum ist die Warnung 4 statt 3?

Answer 1

Innen setTimeout Rückruf this bezieht sich auf Fensterobjekt, es ist also variabel in globalem Kontext definiert abruft.

Sie können es arbeiten, indem Sie diesen Kontext unter Verwendung Function#bind Methode binden.

var x = 4, 
 
    obj = { 
 
    x: 3, 
 
    bar: function() { 
 
     var x = 2; 
 
     setTimeout(function() { 
 
     var x = 1; 
 
     alert(this.x); 
 
     }.bind(this), 1000); 
 
    } 
 
    }; 
 
obj.bar();

---

oder eine lokale Variable verwenden, um die Bezugnahme auf this zwischenzuspeichern und verwenden, die innerhalb Callback-Funktion.

var x = 4, 
 
    obj = { 
 
    x: 3, 
 
    bar: function() { 
 
     var x = 2, 
 
     that = this; 
 
     setTimeout(function() { 
 
     var x = 1; 
 
     alert(that.x); 
 
     }, 1000); 
 
    } 
 
    }; 
 
obj.bar();

---

Siehe dazu auch die MDN-Dokumentation: The "this" problem