[JS] Property veranderen van "superclass"

[Fles]

Binnen een class heb ik een eventhandler zitten van een XMLHttpRequest object, nu wil ik in die eventhandler een property veranderen van de "superclass".

Even wat illustrerende code:

JavaScript:

function superclass()  {
  this.requestObject = new XMLHttpRequest();

  this.superproperty = 0;

  this.superfunction = function() {
    this.requestObject.onreadystatechange = function() {
      this.superproperty = 1; //KNEL PUNT!
    }
  }
}

Druk en zetfouten voorbehouden

Nu kan ik natuurlijk lomp de property van het object zetten buiten de class om op de volgende manier:

JavaScript:

superclassObject.superproperty = 1

maar dat is natuurlijk niet zo netjes.

Is er een nette manier hoe ik dit kan oplossen? Ik ben nog geen "parent" tegen gekomen in JavaScript en ik heb wel zo goed mogelijk gezocht, maar ik heb eigenlijk niet zo'n goed idee op welke termen ik het beste kan zoeken.

[SchizoDuckie]

Wat je hier fout doet is dat je er vanuit gaat in de function() die je aanmaakt aan je requestObject dat je eigenlijk binnen je superClass zit, maar dat is natuurlijk niet zo want die functie wordt uitgevoerd binnen de scope (binnen het afgeschermde 'object') requestObject, en die weet totaal niet van de properties van je superClass.

Veel frameworks hebben dit opgelost d.m.v. een bind() functie:

JavaScript:

// plemp dit ergens in je js file
Function.prototype.bind = function(object) {
  var __method = this;
  return function() {
    return __method.apply(object, arguments);
  }
}

en dan wordt jouw code:

JavaScript:

function superclass()  {
  this.requestObject = new XMLHttpRequest();

  this.superproperty = 0;

  this.superfunction = function() {
    this.requestObject.onreadystatechange = function() {
      this.superproperty = 1; //KNEL PUNT OPGELOST!!
    }.bind(this);
  }
}

[Fles]

Dat werkt perfect. Ik heb door dit probleem m'n code direct zo strak mogelijk gekregen

Ik snap de werking nog niet helemaal, maar dat gaat ook wel goed komen.

[crisp]

Wat bind() doet is de betreffende functie in de scope van een bepaald object (in dit geval 'this' wat dus verwijst naar je superclass instance) uitvoeren.

SchizoDuckie schreef op dinsdag 08 mei 2007 @ 21:28:
[...] maar dat is natuurlijk niet zo want die functie wordt uitgevoerd binnen de scope (binnen het afgeschermde 'object') requestObject [...]

Dat is geheel implementatie-afhankelijk

[ Voor 56% gewijzigd door crisp op 09-05-2007 01:08 ]

[SchizoDuckie]

crisp schreef op woensdag 09 mei 2007 @ 01:06:
Wat bind() doet is de betreffende functie in de scope van een bepaald object (in dit geval 'this' wat dus verwijst naar je superclass instance) uitvoeren.


[...]

Dat is geheel implementatie-afhankelijk

brrr scary Ik ben blij dat ik dat soort dingen door een frameworkje laat afhandelen

[Fles]

Heb ik nog een laatste vraag met betrekking tot dit.
Als ik nou het volgende heb:

JavaScript:

function superclass()  {
  this.requestObject = new XMLHttpRequest();

  this.superproperty = 0;

  this.eventHandler = function() {
      this.superproperty = 1;
  }

  this.superfunction = function() {
    this.requestObject.onreadystatechange = this.eventHandler;
  }
}

Zet ik dan de ".bind(this);" op deze manier:

JavaScript:

this.requestObject.onreadystatechange = this.eventHandler.bind(this);

of

JavaScript:

  this.eventHandler = function() {
      this.superproperty = 1;
  }.bind(this);

Ik heb het geprobeerd en beide lijken te werken, maar maakt het in theorie/praktijk nog verschil? Zelf lijkt mij de eerste netter...