[js] objecten en scope

[tombo_inc]

ik ben bezig met wat zelfgeknutselde objecten in javascript, alleen krijg ik even de kriebels van de variabelen scope. ik snap even niet meer hoe het zit. ik heb de volgende situatie:

JavaScript:

function mijnobject() {
  
  this.id              = 'object1';
  this.subobject   = null;

}

mijnobject.prototype.getStuff = function() {
  
  this.subobject = new HTTPRequest( this.statecheck );
  this.subobject.doGETRequest('ok.html');
  
}

mijnobject.prototype.statecheck = function() {
  
  if( this.subobject.HTTPRequest.readyState == 4 && this.subobject.HTTPRequest.status == 200 ) {
    
    alert(this.subobject.getRequestData( 'text' ));
    
  }
  
}

bovenstaande code is mijn object. in de getStuff methode haal ik middels een httprequest data op. de parameter in de constructor van het object geeft de onreadystatechanged eventhandler aan. in dit geval dus statecheck(). deze methode wordt ook netjes aangeroepen, maar dan begint het probleem. ik krijg dan namelijk de fout dat this.subobject geen eigenschappen heeft in de statecheck methode. waarom kan ik in de statecheck methode niet bij het subobject komen dat ik zojuist in de getStuff methode aangemaakt heb?
als ik overal bij subobject het this keyword weglaat, ik krijg dan normale vars (geloof ik), dan werkt het wel. alleen weet ik dan niet wat voor scope de subobject var heeft en of deze ook buiten mijn object aan te spreken is (dat wil ik dus niet). ik hoop dat iemand mij duidelijkheid kan verschaffen.

[Michali]

Ik denk dat je hier wel wat aan hebt:

JavaScript:

function TestClass(value)
{
    this.value = value;
}

TestClass.prototype.alertValue = function()
{
    alert(
        'Object: ' + this
        + ', Constructor: ' + this.constructor.name
        + ', Source: ' + this.toSource()
        + ', Value: ' + this.value
    );
};

TestClass.prototype.test = function()
{
    // voorbeeld 1
    var func = this.alertValue;
    func();

    // voorbeeld 2
    TestFunc1(this.alertValue);

    // voorbeeld 3
    var self = this;
    TestFunc1(
        function() // anonieme functie
        {
            self.alertValue();
        }
    );

    // voorbeeld 4
    TestFunc2(this.alertValue, this);

    // voorbeeld 5
    TestFunc3(this);
};

function TestFunc1(funcRef)
{
    funcRef();
}

function TestFunc2(funcRef, obj)
{
    funcRef.call(obj);
}

function TestFunc3(obj)
{
    obj.alertValue();
}

var testObj = new TestClass(11);
testObj.test();

Functies zijn gewoon objecten in JS. Je kunt ze dus gewoon ook als parameter doorgeven. Je hebt echter ook de mogelijkheid om functies in de context van een bepaald object aan te roepen. Doorgaans doe je dat in de form van obj.func();, die mogelijkheid heb je echter alleen als func in de prototype van de constructor functie van obj voorkomt.

Stel dat obj een object van class ObjClass is. Dan zou dit precies gelijk zijn aan de bovenstaande aanroep: ObjClass.prototype.func.call(obj);. Op deze manier kun je functies ook aanroepen op objecten die deze functie helemaal niet in de prototype hebben staan. Het aanroepen van een bepaalde functie in de context van een object houdt in dat je binnen die functie met this kunt werken, waarbij this dan verwijst naar dat object. Als je een functie echter aanroept buiten de context van een object, dan verwijst this naar iets anders. (Ik weet niet zeker of het gedefineerd is, maar in Firefox verwijst hij dan naar het Window object.)

Dit is ook wat je in bovenstaande code terug ziet. Vooral TestClass.test is belangrijk. Ik roep de functie op 5 verschillende manieren aan. Daarvoor gebruik ik ook een paar hulp functies om aan te tonen hoe het werkt. In het eerste voorbeeld van ik de functie alertValue eerst op in een lokale variabel. Daarna roep ik hem aan, maar niet meer binnen de context van this. Wat er dus gebeurt is dat this binnen alertValue niet meer naar this in test verwijst. In het 2de geval gebeurt precies hetzelfde. Alleen wordt de functie dan als parameter meegegeven aan een andere functie die hem dan weer aanroept.

In voorbeeld 3 gebeurt wat anders. Daar vang ik this eerst op in de lokale variabel self, welke ik later nodig heb in de (anonieme) functie die ik doorgeef aan TestFunc1. TestFunc1 roept de gegeven functie aan die dan weer gebruik van self maakt. Dit is een belangrijk, maar (zeker in het begin) moeilijk concept om te snappen. Het heet closure, wat inhoudt dat een functie aangemaakt in een bepaalde scope zelf ook toegang heeft tot die scope, naast zijn eigen scope. Die omringende scope wordt er dus al het ware bij ingesloten. Hoewel self niet binnen de scope van de anonieme functie valt, heeft deze er wel toegang tot. Echter niet tot this, wat zeker belangrijk te onthouden is, omdat this altijd verwijst naar de context waarin een functie is aangeroepen (of geen).

In voorbeeld 4 roep ik TestFunc2 aan en geef 2 parameters. De eerste is de functie zelf en de 2de het object waarop ik de functie wil aanroepen. Dit zorgt dus dat this binnen alertValue nog steeds naar dezelfde this binnen test verwijst.

Het laatste voorbeeld is typische polymorphisme. TestFunc3 vraagt een object met een bepaalde interface (in dit geval moet functie alertValue geimplementeerd zijn) en roept daaruit een functie aan. Welk object of class het is, is niet belangrijk.

Mijn voorkeur voor jouw probleem gaat uit naar voorbeeld 3. Dit is de gemakkelijkste oplossing. Ik zou zeggen, ga nog eens wat opzoeken over closure en zorg dat je dit concept goed snapt. Het zal je zeker helpen bij het ontwikkelen van JS scripts.

[tombo_inc]

heel erg bedankt!
ik denk dat ik het nu snap. wat ik dus (fout) deed was een functie object meegeven als parameter aan mijn andere object. in dat andere object werd die functie aangeroepen, maar gewoon als normale functie en dus buiten de object context. in deze normale functie heeft this geen betekenis (of refereert in ieder geval niet naar mijn object) en daarom werkte het niet. met jouw oplossingen (ik heb ook voor 3 gekozen) zorg je ervoor dat de functie wel in object context wordt aangeroepen, waardoor this weer beschikbaar wordt en alles dus werkt.
ik ga me zeker nog even verdiepen in die closure theorie, maar het principe is me in ieder geval duidelijk.
nogmaals bedankt