利用prototype实现继承:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js面向对象</title>
<script type="text/javascript">
//动物类
function Animal(){
this.name;
}
//呼吸方法
Animal.prototype.respiratory = function(){
alert(this.name+'正在呼吸');
}
//吃方法
Animal.prototype.eat = function(){
alert('动物在吃东西');
}
//鱼类
function Fish(){}
//继承动物
Fish.prototype = new Animal;
//重写动物吃的方法
Fish.prototype.eat = function(){
this.constructor.prototype['eat']();//调用父类方法eat
alert(this.name+'正在吃东西');
}
var fish = new Fish();
fish.name = 'forever';
fish.respiratory();
fish.eat();
</script>
</head>
<body>
</body>
</html>
利用base.js实现继承:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js面向对象</title>
<script type="text/javascript" src="Base.js"></script>
<script type="text/javascript">
//创建动物类
var Animal = Base.extend({
//构造方法
constructor : function(){
this.name;
},
//呼吸方法
respiratory : function(){
alert(this.name+'正在呼吸');
},
eat : function(){
alert('动物在吃东西');
}
});
//创建鱼类继承动物类
var Fish = Animal.extend({
constructor : function(){
},
eat : function(){
this.base();//调用父类方法eat();
alert(this.name+'正在吃东西');
}
});
var fish = new Fish();
fish.name = 'forever';
fish.respiratory();
fish.eat();
</script>
</head>
<body>
</body>
</html>
利用Prototype.js实现继承:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js面向对象</title>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript">
//动物类
var Animal = Class.create({
//初始化方法
initialize:function(){
this.name;
},
//呼吸方法
respiratory : function(){
alert(this.name+'正在呼吸');
},
eat : function(){
alert('动物在吃东西');
}
});
//鱼类,继承动物类
var Fish = Class.create(Animal,{
initialize:function(){
},
//重写动物吃的方法
eat : function($super){
$super();//调用父类eat方法
alert(this.name+'正在吃东西');
}
});
var fish = new Fish();
fish.name = 'forever';
fish.respiratory();
fish.eat();
</script>
</head>
<body>
</body>
</html>
带命名空间的实现类继承:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js面向对象命名空间</title>
<script type="text/javascript" src="Base.js"></script>
<script type="text/javascript">
var org = {};
org.forever = {};
org.forever.util = {};
//创建动物类
org.forever.util.Animal = Base.extend({
//构造方法
constructor : function(){
this.name;
},
//呼吸方法
respiratory : function(){
alert(this.name+'正在呼吸');
},
eat : function(){
alert('动物在吃东西');
}
});
//创建鱼类继承动物类
org.forever.util.Fish = org.forever.util.Animal.extend({
constructor : function(){
},
eat : function(){
this.base();//调用父类方法eat();
alert(this.name+'正在吃东西');
}
});
var fish = new org.forever.util.Fish();
fish.name = 'forever';
fish.respiratory();
fish.eat();
</script>
</head>
<body>
</body>
</html>
js接口方式:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js接口</title>
<script type="text/javascript" src="Base.js"></script>
<script type="text/javascript">
//用户实体类
function User(){
this.userName;
this.password;
}
//用户业务接口
var IUserBiz = {
addUser:null,
delUser:null,
updateUser:null,
queryUser:null
};
//实现接口的方法,可以演变成多接口实现,只是一种模拟
//这种写法也可以利用在多继承身上
function implements(interfaceName,proxyMethds){
var proxy = function(){};
for(var methodName in interfaceName){
proxy.prototype[methodName] = interfaceName[methodName];
}
for(var methodName in proxyMethds){
proxy.prototype[methodName] = proxyMethds[methodName];
}
return proxy;
}
//实现了接口方法的类
var UserBizImpl = implements(IUserBiz,{
addUser:function(user){alert('用户名字:'+user.userName);}
});
var userBiz = new UserBizImpl();
var user = new User();
user.userName = 'forever';
user.password = '123456';
userBiz.addUser(user);
userBiz.delUser(user);//抛出异常
</script>
</head>
<body>
</body>
</html>