[英]Child class can't call its parent's prototype method
I'm learning JS prototypes. 我正在学习JS原型。
From Java
language point I expect,that SpecificRectangle
object will have access to area()
method,due to area() is the method of its parent(Rectangle class) prototype. 从Java
语言的角度来看,我希望, SpecificRectangle
对象可以访问area()
方法,因为area()是其父(Rectangle类)原型的方法。
function Rectangle(w,h){
this.width = w;
this.height=h;
}
Rectangle.prototype.area = function(){return this.width*this.height}
function SpecificRectangle(w,h,angle){
Rectangle.call(this,w,h);
SpecificRectangle.prototype=new Rectangle();
}
var specrec = new SpecificRectangle(7,8,45);
All at all I can't call area()
method on SpecificRectangle
instance. 总而言之,我无法在SpecificRectangle
实例上调用area()
方法。
Standard JS error got: 标准JS错误得到:
TypeError: specrec.area is not a function
[Break On This Error] specrec.area()
What is the explanation and reason of such encapsulation? 这种封装的解释和原因是什么?
Honestly i don't know the exact reason but you need to set the prototype outside the constructor function: 老实说,我不知道确切的原因,但你需要在构造函数之外设置原型:
function SpecificRectangle(w, h, angle) {
Rectangle.call(this,w,h);
}
SpecificRectangle.prototype = new Rectangle();
SpecificRectangle.prototype.constructor = SpecificRectangle; // Otherwise instances of SpecificRectangle would have a constructor of Rectangle
Working example here . 这里的工作示例。
Edit following the comment by @herby: 编辑 @herby的评论:
It seems indeed that the upper method could break the prototypal inheritance depending on how the super-class constructor is built (see this article ). 看来确实上面的方法可以打破原型继承,这取决于如何构建超类构造函数(参见本文 )。
A more robust solution is to use Object.create
( source - thanks herby) 更强大的解决方案是使用Object.create
( source - thanks herby)
// in case Object.create does not exist
if (typeof Object.create !== 'function') {
Object.create = function(o) {
var F = function() {};
F.prototype = o;
return new F();
};
}
function Rectangle(w, h) {
this.width = w;
this.height = h;
}
Rectangle.prototype.area = function() {
return this.width * this.height
}
function SpecificRectangle(w, h, angle) {
Rectangle.call(this, w, h);
}
SpecificRectangle.prototype = Object.create(Rectangle.prototype);
SpecificRectangle.prototype.constructor = SpecificRectangle;
var r = new SpecificRectangle(100, 50, 30);
alert(r.area());
You should copy base class prototype. 您应该复制基类原型。 Eg: 例如:
function Rectangle(w,h){
this.width = w;
this.height=h;
}
Rectangle.prototype.area = function(){return this.width*this.height}
function SpecificRectangle(w,h,angle){
Rectangle.call(this,w,h);
}
function SpecificRectangleProto(){}
SpecificRectangleProto.prototype = Rectangle.prototype;
SpecificRectangle.prototype = new SpecificRectangleProto();
var specrec = new SpecificRectangle(7,8,45);
alert(specrec.area);
I suggest to extract extend method from some framework. 我建议从某个框架中提取extend方法。 For example ExtJS. 例如ExtJS。 With such method you can extend class like this: 使用这种方法,您可以像这样扩展类:
SpecificRectangle = extend(Rectangle, {
constructor: function(w,h,angle){
SpecificRectangle.superclass.constructor.call(this,w,h);
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.