Question

我正在一本名为Object-Oriented JavaScript的书中练习。

第5章的练习包含以下4个问题：

创建一个名为shape的对象，该对象具有type属性和getType()方法。

定义原型为shape的Triangle()构造函数。使用Triangle()创建的对象应该有三个   properties-a，b和c，表示a的边长   三角形。

向名为getPerimeter()的原型添加新方法。

使用以下代码测试您的实现：

。
  var t = new Triangle(1, 2, 3);
  t.constructor === Triangle;  // true
  shape.isPrototypeOf(t);      // true
  t.getPerimeter();            // 6
  t.getType();                 // "triangle"

这是我对上述问题的解决方案：

var shape = {
    type: 'triangle',
    getType: function() {
        return this.type;
    }
};

function Triangle(a, b, c) {
    this.a = a;
    this.b = b;
    this.c = c;
}

Triangle.prototype = shape;  // Maybe something goes wrong here

Triangle.prototype.getPerimeter = function() {
    return this.a + this.b + this.c;
}

// ======================================================
var t = new Triangle(1, 2, 3);              
console.log(t.constructor === Triangle);  // false
console.log(shape.isPrototypeOf(t));      // true
console.log(t.getPerimeter());            // 6
console.log(t.getType());                 // triangle

为什么console.log(t.constructor === Triangle);输出false作为结果？

我已尝试删除console.log(t.constructor === Triangle);，这会使t.constructor === Triangle等于true，但会导致TypeError: t.getType is not a function错误。

如何使我的执行结果与本书提供的答案相同？

Answer 1

添加

Triangle.prototype.constructor = Triangle;

之后

Triangle.prototype = shape;

解决了我的问题。

在第173页的第6章中，书中说

覆盖原型会对构造函数属性产生副作用。因此，在继承
之后重置构造函数是个好主意

Answer 2

＆＃13;

Shape = {
  type: 'Shape',
  getType: function (){ return this.type;}
}

function Triangle( a, b, c){
    this.a = a;
    this.b = b;
    this.c = c;
    this.type = 'Triangle';
}

Triangle.prototype = Shape; 

Triangle.prototype.constructor = Triangle;

Triangle.prototype.getPerimeter = function (){
  console.log('Get Perimeter');
  return this.a + this.b + this.c;
  
}

var t = new Triangle(1,2,3);
console.log(t.constructor === Triangle);
console.log(Shape.isPrototypeOf(t));      
console.log(t.getPerimeter());            
console.log(t.getType());

＆＃13;

将Shap对象分配给Triangle.prototype，然后使用Triangle覆盖构造函数将解决问题。

如何正确设置原型？

2 个答案: