我在实现继承时在JavaScript中练习OOP我收到了Uncaught类型的错误错误:sqr.area不是函数。在我的代码中,我有一个BoxShape类,继承了Square类。我试图使用Square对象调用区域函数,它是BoxShape的一部分,并且根据我将其继承到square类,因为我已将其原型设置为BoxShape类。但我无法弄清楚错误在哪里。
function show(msg){
console.log(msg);
}
function BoxShape(){
Object.defineProperty(this,'length',{
get: function(){
return length;
},
set: function(val){
length = val;
},
enumerable : true,
configurable:true
});
Object.defineProperty(this,'width',{
get:function(){
return width;
},
set:function(val){
width=val;
},
configurable : true,
enumerable : true,
});
this.area=function(){
return this.width*this.length;
}
}
//inherited square class
function Square(size){
Object.defineProperty(this,'width',{
get: function(){
return width;
},
set: function(val){
width = val;
},
configurable: true,
enumerable:true,
});
Object.defineProperty(this,'length',{
get:function(){
return length;
},
set:function(val){
length=val;
},
configurable:true,
enumerable:true,
});
}
Square.prototype = Object.create(BoxShape.prototype,{
constructor:{
configurable:true,
enumerable:true,
writable:true,
value:Square
}
});
var sqr = new Square();
sqr.length = 10;
sqr.width = 12;
show(sqr.area());
答案 0 :(得分:1)
您的错误在于,您将函数定义为实例属性(对于每个实例而言都是个体)而不是原型属性(对于所有实例都是相同的并且是直接继承的)。
正如Bergi所提到的,由于你的getter和setter没有做任何事情,你只需在构造函数中直接分配这些属性就更容易了。
最后但并非最不重要的是,您可能希望调用BoxShape
构造函数中的Square
构造函数来初始化width
和height
道具。
function show(msg){
console.log(msg);
}
function BoxShape(){
this.width = 0;
this.height = 0;
}
BoxShape.prototype.area=function(){
return this.width*this.length;
}
//inherited square class
function Square(size){
BoxShape.call(this);
}
Square.prototype = Object.create(BoxShape.prototype,{
constructor:{
configurable:true,
enumerable:true,
writable:true,
value:Square
}
});
var sqr = new Square();
sqr.length = 10;
sqr.width = 12;
show(sqr.area());
答案 1 :(得分:1)
您没有将BoxShape
的原型设置为具有该方法。在执行此操作时,可以将每个单独的实例设置为具有该方法的实例:
// this.whatever is instance specific, which isn't what you want in your case
this.area=function(){
return this.width*this.length;
}
那不是原型。
你应该这样做:
BoxShape.prototype.area = function() {
return this.width*this.length;
};