重寫javascript方法

Question

我是JavaScript中OOP的新手。當我想要重寫某個方法時，我無法正確理解它。我在下面舉了一個我的問題的例子。此外，在http://jsfiddle.net/sRyQA/

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()); 

Answer 1

的問題是，

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

將設置特定實例的財產（如你是正確調用父對新MyRectangle實例構造函數），和這將「覆蓋」所有繼承的方法。

你的原型鏈是這樣的：

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

，其中在該實例的retunArea方法是你在MyGeometryObject構造函數分配一個與原型的一個是已覆蓋之一。

但是，如果您分配這個方法MyGeometryObject的prototype

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

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

那麼它會工作，爲右returnArea方法將在原型鏈中提前到來：

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

其它注意事項：

• 構造函數函數名稱應以大寫字母開頭。

• 如果設置的MyRectangle原型這種方式，你還應該設置constructor屬性回MyRectangle：

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