继承机制的实现(2):实例

xbObjects的目的是为JavaScript提供更强的面向对象模型,不只支持继承,还支持方法的重载和调用超类方法的能力。要实现这一点,xbObjects需要执行下面的几步。

第一步:必须注册类,需定义它继承了那个类,调用方式如下: _classes.registerClass("Subclass_Name","Superclass_Name");
这里,子类和超类名都以字符串形式传进来,而不是指向它们的构造函数的指针。这个调用必须放在指定子类的构造函数前。如果新的类没有继承任何类,调用registerClass()时也可以只用第一个参数。

第二步:在构造函数内部调用defineClass()方法,传给它类名即被Clary称为原型函数的(prototype function)的指针,该函数用于初始化对象的所有属性和方法。例如:

_classes.registerClass("ClassA");
function ClassA(color) {
_classes.defineClass("ClassA",prototypeFunction);
function prototypeFunction() {
//...
}
}

可以看到,原型函数(prototypeFunction())位于构造函数内部。它的主要用途是在适当的时候把所有方法赋予该类(在这一点上与动态原型相似)

第三步是为该类创建init()方法。该方法负责设置该类的所有属性,它必须接受与构造函数相同的参数。作为一种规约,init()方法总是在defineClass()方法后调用。例如:

_classes.registerClass("ClassA");
function ClassA(sColor) {
_classes.defineClass("ClassA",prototypeFunction);
this.init(sColor);
function prototypeFunction() {
ClassA.prototype.init=function(sColor){
this.parentMethod("init");
this.color=sColor;
};
}
}

注意到在init()方法中调用了parentMethod()方法。xbObjects以这种方式允许类调用它的超类的方法。 parentMethod()方法接受任意多个参数,但第一个参数总是要调用的父类方法的名字(该参数必须是字符串,而不是函数指针),所有其他参数都被传给父类的方法。

第四步也是最后一步,在原型函数内添加类的其他方法:

_classes.registerClass("ClassA");
function ClassA(sColor){
_classes.defineClass("ClassA",prototypeFunction);
this.init(sColor);
function prototypeFunction() {
ClassA.prototype.init=function(sColor){
this.parentMethod("init");
this.color=sColor;
};
ClassA.prototype.showColor=function() {
alert(this.color);
};
}
}

然后,可以利用常规方式创建类的实例,并调用类的方法:

var aClass=new ClassA("red");
aClass.showColor();

例子:重写多边形类

<script type="text/javascript" src="xbObjects.js"></script>
<script type="text/javascript">
//继承机制的实现(2):实例
//其他的继承方式-xbObjects
//重写多边形类的例子
//首先重写Polygon类
_classes.registerClass("Polygon");
function Polygon(iSides){
_classes.defineClass("Polygon",prototypeFunction);
this.init(iSides);
function prototypeFunction(){
Polygon.prototype.init=function(iSides){
this.parentMethod("init");
this.sides=iSides;
};
Polygon.prototype.getArea=function(){
return 0;
};
}
}
//接着重写Triangle类
_classes.registerClass("Triangle","Polygon");
function Triangle(iBase,iHeight){
_classes.defineClass("Triangle",prototypeFunction);
this.init(iBase,iHeight);
function prototypeFunction(){
Triangle.prototype.init=function(iBase,iHeight){
this.parentMethod("init",3);
this.base=iBase;
this.height=iHeight;
};
Triangle.prototype.getArea=function(){
return 0.5*(this.base)*(this.height);
};
}
}
//Rectangle类的重写
_classes.registerClass("Rectangle","Polygon");
function Rectangle(iLength,iWidth){
_classes.defineClass("Rectangle",prototypeFunction);
this.init(iLength,iWidth);
function prototypeFunction(){
Rectangle.prototype.init=function(iLength,iWidth){
this.parentMethod("init",4);
this.length=iLength;
this.width=iWidth;
};
Rectangle.prototype.getArea=function(){
return (this.length)*(this.width);
};
}
}
//测试
var tri=new Triangle(4,8);//输出16
alert(tri.getArea());
var rec=new Rectangle(4,8);//输出32
alert(rec.getArea());
</script>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值