Javascript und this!

[Kyuu]

this ist eine Referenz auf das Objekt, in dessen Kontext die Methode aufgerufen wurde.

Angenommen der folgende Code wird im globalen Geltungsbereich definiert:

Code:

var bar = "global bar";

function getBar() {
  return this.bar;
}

Im folgenden Code wird nun getBar() im Kontext des globalen Objekts aufgerufen, d.h. this ist eine Referenz auf das globale Objekt:

Code:

var result = getBar(); // result enthält nun den String "global bar"

Im folgenden Code wird nun getBar() im Kontext des Objekts foo aufgerufen (mit Hilfe des Punkt-Operators), insofern ist this eine Referenz auf foo:

Code:

function Foo() {
  this.bar = "foo's bar";
}

Foo.prototype.getBar = getBar; // Vererbung in JavaScript wird in der Regel mit Hilfe der prototype-Kette realisiert

var foo = new Foo();

var result = foo.getBar(); // result enthält nun den String "foo's bar"

Es ist allerdings möglich eine Methode mit einem fest definierten this aufzurufen:

Code:

var result = foo.getBar.call(this); // result enthält nun den String "global bar", da getBar() mit dem globalen Objekt als this aufgerufen wurde

Es ist auch möglich Methoden fest an ein this zu binden, d.h. egal mit welchem Objekt als this die Methode aufgerufen wird, es wird immer das vorher definierte this für den Aufruf genommen:

Code:

Foo.prototype.getBar = getBar.bind(this); // Foos getBar() wird nun immer im Kontext des globalen Objekts aufgerufen

var foo = new Foo();

var result = foo.getBar(); // result enthält nun den String "global bar"

Näheres zu call() und bind(): https://developer.mozilla.org/en/Jav...tion#Methods_2

[YoshiGreen]

Warum lange drüber reden, wenn man testen kann?
http://jsfiddle.net/AQ5BU/ (führende Meeresbiologen empfehlen eine offene Browserkonsole um die Ausgabe zu sehen!)

Kyuu hat damit drunken monkeys Vermutung bestätigt, dass das globale this das window-object darstellt. call() und bind() kannte ich bislang aber noch nicht, danke dafür :o)

[Lachsen]

Zu dem Code Beispiel von Kyuu will ich noch kurz etwas ergänzen:

Bei dem folgenden Beispiel wird "global bar" ausgegeben:

Code:

var bar = "global bar";

function getBar() {
  return this.bar;
}

alert(getBar())

Mich persönlich hat das verwirrt, da ich nicht gedacht habe, dass sogar eine var declaration das window objekt erweitert.
Dies passiert allerdings wirklich nur im global scope.

Bei diesem Beispiel wiederum wird "undefined" ausgegeben:

Code:

(function(){
    var bar = "global bar";

    function getBar() {
      return this.bar;
    }

    alert(getBar())
})();

Im Prinzip wird hier eine annonyme Funktion aufgerufen, die den selben Code ausführt, allerdings nicht im global scope.
Was hier funktioniert, wäre folgendes:

Code:

(function(){
    var bar = "global bar";

    function getBar() {
      return bar;
    }

    alert(getBar())
})();

Btw, hier noch ein ganz nettes Video zu JavaScript, das viele Eigenarten der Sprache erklärt. Ist aber auf Englisch und ziemlich lang:

https://www.youtube.com/watch?v=seX7...ayer_embedded#!