Prototype 1.6的类继承
2008-12-28 17:52:00
原来的Prototype支持Class,大概就是下面这样
Code
var PeriodicalExecuter = Class.create();
PeriodicalExecuter.prototype = {
initialize: function (callback, frequency) {
this .callback = callback;
this .frequency = frequency;
this .currentlyExecuting = false ;
this .registerCallback();
},
.
}
调用时候new PeriodicalExecuter(…)其实就是调用initialize构造方法,不能实现类的继承,1.6当中改进了Class的构造,大概介绍一下
首先,create可以传参数了Class.create(parent,methods),parent可以是匿名对象或者类,methods就是子类方法,示例:
代码
1.
var test=Class.create({a: 123 ,b: 456 ,c:[ 1 , 2 , 3 ],initialize:function(){}}) 2.
var result= new test;
就可以取代原来的
代码
1.
var test=Class.create(); 2.
test.prototype={ 3.
a: 123 , 4.
b: 456 , 5.
c:[ 1 , 2 , 3 ], 6.
initialize:function(){} 7.
}
这样了,这还不是重点,下面讲继承
代码
1.
var a=Class.create({initialize:function(){},test1: 123 ,test2: 456 ,check:function(){alert( this .test1)}}) 2.
var b=Class.create(a,{check:function(){alert( this .test2)}}) 3.
c= new b; 4.
c.check()
当然显示456了,因为子类覆盖父类同名方法,但是如果你还想调用父类方法呢,那好办,Prototype定义了$super关键字,但是必须作为子类方法第一个参数,就是
代码
1.
var a=Class.create({initialize:function(){},test1: 123 ,test2: 456 ,check:function(){alert( this .test1)}}) 2.
var b=Class.create(a,{check:function($ super ){alert( this .test2);$ super ()}})
至此,Prototype完成了对js的Class扩展任务
加入了mixin方法和类的addMethods方法,比如现在可以
代码
1.
var a=Class.create({a; 1 ,b: 2 },{c: 3 ,d: 4 },......)
这些都可以被加入到类里面,当然没有继承,如果重名,后面覆盖前面,再有addMethods
比如
代码
1.
a=Class.create({a: 1 ,b: 2 ,initialize:function(){}}) 2.
b= new a 3.
a.addMethods({ 4.
test:function(){alert( 123 )}, 5.
test2:function(){alert( 456 )} 6.
}) 7.
b.test() 8.
b.test2()
基本相当于a.prototype扩展,但是不完全
代码
1.
a=Class.create({a: 1 ,b: 2 ,initialize:function(){},test:function(){alert( this .a)}}) 2.
b=Class.create(a,{}) 3.
b.addMethods({test:function($ super ){alert( this .b);$ super ()}})
可以支持$super的继承
参考资料:
http://prototypejs.org/learn/class-inheritance
creation.js
var Animal = Class.create({
initialize : function (name) {
this .name = name;
},
eat : function (food) {
this .say( ' Yum! ' );
},
say : function (msg) {
document.write( this .name + ' : ' + msg + " <br /> " );
}
});
extend.js
var Cat = Class.create(Animal, {
initialize : function ($super, name) {
this .name = " extend " + name;
$super(name);
},
eat : function ($super, food) {
if (food instanceof Mouse) return $super(food);
return this .say( ' Yuck! I only eat mice. ' );
}
});
var Mouse = Class.create(Animal);
var fido = new Animal( ' Fido ' );
var tom = new Cat( ' Tom ' );
var jerry = new Mouse( ' Jerry ' );
tom.say( ' Hi ' );
jerry.eat( ' cheese ' );
tom.eat( ' bone ' );
tom.eat(fido);
tom.eat(jerry);
Please enable JavaScript to view the comments powered by Disqus.
comments powered by