2011-07-04 4 views
1

Je suis nouveau sur POO en javascript. Je ne peux pas le faire correctement quand je veux remplacer une méthode. J'ai fait un exemple de mon problème ci-dessous. De plus en http://jsfiddle.net/sRyQA/Substitution d'une méthode javascript

function myGeometryObject(r, x, y){ 

    this.r = r; 
    this.x = x; 
    this.y = y; 

    var OBJ = this; 

    this.returnArea = function(){ 
     return 'wrong override'; 
    } 
} 

function myRectangle(r, x, y){ 
    myGeometryObject.call(this, r, x, y); 
} 
myRectangle.prototype = new myGeometryObject(); 

myRectangle.prototype.returnArea = function(){ 
    return 'right override';//I want JS to use this method 
} 
var rectangle = new myRectangle(0, 5, 5); 
alert(rectangle.returnArea()); 

Répondre

8

Le problème est que

this.returnArea = function(){ 
    return 'wrong override'; 
} 

sera définir la propriété de ce particulier instance (comme vous correctement appeler le constructeur du parent sur la nouvelle MyRectangle par exemple), et cela va "remplacer" toutes les méthodes héritées.

Votre chaîne prototype ressemble à ceci:

+------------------+  +------------------+  +------------------+ 
| MyRectangle  |  | MyRectangle  |  | MyGeometry  | 
| instance   |------->| prototype  |------->| prototype  | 
|     |  |     |  |     | 
| wrong returnArea |  | right returnArea |  |     | 
+------------------+  +------------------+  +------------------+ 
          (MyGeometry instance) 

où la méthode retunArea à l'instance est celui que vous attribuez dans le constructeur MyGeometryObject et celui du prototype est celui que vous avez écrasé.

Mais si vous attribuez cette méthode à l » prototype

function MyGeometryObject(r, x, y) { 
    this.r = r; 
    this.x = x; 
    this.y = y;  
} 

MyGeometryObject.prototype.returnArea = function(){ 
    return 'wrong override'; 
} 

MyGeometryObject il fonctionnera, comme la bonne méthode returnArea va venir plus tôt dans la chaîne prototype:

+------------------+  +------------------+  +------------------+ 
| MyRectangle  |  | MyRectangle  |  | MyGeometry  | 
| instance   |------->| prototype  |------->| prototype  | 
|     |  |     |  |     | 
|     |  | right returnArea |  | wrong returnArea | 
+------------------+  +------------------+  +------------------+ 
          (MyGeometry instance) 

Notes complémentaires :

  • Les noms de fonction de constructeur doivent commencer par une lettre majuscule.
  • Si vous définissez le prototype de MyRectangle cette façon, vous devez également définir la propriété à constructorMyRectangle:

    MyRectangle.prototype = new MyGeometryObject(); 
    MyRectangle.prototype.constructor = MyRectangle; 
    
+0

Une autre méthode consiste à remplacer la méthode dans le constructeur 'myRectangle' (après application les arguments du constructeur 'myGeometryObject'). http://jsfiddle.net/sRyQA/2/ – katspaugh

+0

@Felix KLing Que fait MyRectangle.prototype.constructor = MyRectangle? – einstein

+0

@ Woho87: Il définit la propriété 'constructor' du prototype sur' MyRectangle'. Cette propriété indique toujours la fonction dont le prototype est le prototype. Essayez: 'function Foo() {}; console.dir (Foo.protoype); –

Questions connexes