之前用js总是一个个的function,看见别人用js面向对象的写法,有点不懂,这几天看见同事直接用一个很小的base.js及简单实现了javascript的面向对象,并轻松实现了继承,
base.js获取地址:http://dean.edwards.name/base/Base.js
/**
* 创建类
* 通过调用Base类里面的extend方法,可以创建类:
*/
var Animal = Base.extend({
name:"", //成员变量
//构造方法
constructor:function(name){
this.name = name;
},
//方法
eat:function(){
this.say("hello!");
},
say:function(message){
alert(this.name+":"+message);
}
});
//使用方法
new Animal("tom").eat(); //alert:tom:hello!
/**
* 继承
* extend:调用这个方法,可以用另一个接口来扩展一个对象
* base:如果某个方法被重载了,通过base方法可以访问被重载方法
*
* 所有使用这种方式创建的类会继承extend方法,所以我们可以简单的为Animal类创建子类
*/
var Cat = Animal.extend({
eat:function(food){
if(food instanceof Mouse){
this.base(); //调用被重载的方法
} else {
this.say("Yuk! I only eat mice.");
}
}
});
var Mouse = Animal.extend();
new Cat('Cat').eat(new Mouse()); //alert:Cat:hello!
new Cat('Cat').eat('test'); //alert:Cat:Yuk! I only eat mice.
/**
* 实例方法、类方法比较
* 如果你定义了一个叫做init的类方法 (不是实例方法) ,它会在类创建的时候自动的调用。
* 在原型构造阶段(衍生子类)构造函数永远不会被调用
*/
var Shape = Base.extend({
constructor:function(x,y){
alert(x+y);
}
});
var Circle = Shape.extend({ // instance interface
constructor: function(x, y, radius) {
this.base(x, y);
this.radius = radius;
},
radius: 0,
getCircumference: function() {
return 2 * Circle.PI * this.radius;
}
},
{ // class interface
PI: 3.14,
init:function(){ //类方法 在类创建的时候就会被调用
alert(2);
}
});
//alert:先 2 在 3 后 18.84
alert(new Circle(1,2,3).getCircumference());