Question

我需要做以下事情：

function Shape (width, height) {
    var self = this;
    self.width = width;
    self.height = height;
    self.calculateSurface = function () {
        return (self.width * self.height);
    };
};

function Circle (radius) {
    //make sure width == height == radius.

};

Circle.prototype = new Shape;
Circle.prototype.constructor = Circle();

function Triangle (base, height) {
    var self = this;
    Shape.apply(self, arguments);
};

Triangle.prototype = new Shape;
Triangle.prototype.constructor = Triangle();

var circle = new Circle(5);
var triangle = new Triangle(5, 8);

alert(circle.calculateSurface());
alert(triangle.calculateSurface());

对基本原型方法的两次调用都必须返回调用者的区域，但不会覆盖该方法。

如何在没有覆盖的情况下使三角形和（半径*半径）* pi为圆形返回（宽度*高度）/ 2？

感谢您的时间和所有人！

修改

var output = document.getElementById('output');

function Shape(width, height) {
    var self = this;

    self.width = width;
    self.height = height;
};

Shape.prototype.calculateSurface = function () {
    return (this.width * this.height);
};

function Rectangle(width, height) {
    Shape.apply(this, arguments);
};
Rectangle.prototype = new Shape;
Rectangle.prototype.constructor = Rectangle;

function Triangle(base, height) {
    Shape.apply(this, arguments);
};
Triangle.prototype = new Shape;
Triangle.prototype.constructor = Triangle;

Triangle.prototype.calculateSurface = function () {
    return ((this.width * this.height) / 2);
};

function Circle(radius) {
    Shape.apply(this, arguments);
};
Circle.prototype = new Shape;
Circle.prototype.constructor = Circle;

Circle.prototype.calculateSurface = function () {
    return((this.width * this.width) * Math.PI);
};

// testing
var outputStr = "";
var outputArr = [];

for (var i = 0; i < 30; i++) {
    var rectangle = new Rectangle(i + 1, i + 2);
    var triangle = new Triangle(i + 1, i + 2);
    var circle = new Circle(i + 1);
    outputArr[i] = rectangle;
    outputStr += "Rectangle width: <b>" + rectangle.width + "</b> height: <b>" + rectangle.height + "</b> area: <b>" + rectangle.calculateSurface() + "</b><br />";
    outputArr[i + 1] = triangle;
    outputStr += "Triangle base: <b>" + triangle.width + "</b> height: <b>" + triangle.height + "</b> area: <b>" + triangle.calculateSurface() + "</b><br />";
    outputArr[i + 2] = circle;
    outputStr += "Circle radius: <b>" + rectangle.width + "</b> area: <b>" + circle.calculateSurface() + "</b><br /><br />";
};

output.innerHTML = outputStr;

它正常工作，我希望我理解正确。 再次感谢！

Answer 1

首先，您不应该在实例上定义自定义类型（a.k.a。“class”）的方法（calculateSurface），因此，不是：

self.calculateSurface = function () {
    return (self.width * self.height);
};

但是：

Shape.prototype.calculateSurface = function () {
    return (this.width * this.height);
};

然后你需要 shadow 原型链中更高的属性。因此，查找将首先查看Triangle.prototype，然后仅查看Shape.prototype - 使用它找到的第一个属性。

Triangle.prototype = new Shape;
// Note that you don't need to put parens after Triangle.
// You only set property to point at constructor function itself,
// not to the value constructor returns when invoked. (Also, constructor 
// should be invoked with `new` operator, not just with parens).
Triangle.prototype.constructor = Triangle; 
// now shadowing Shape.prototype.calculateSurface
Triangle.prototype.calculateSurface = function () { 
  // custom code here
}

同样适用于Circle。

如何更改原型的方法而不覆盖它？

1 个答案: