关于javascript类继承的学习和发掘的代码实战-处女篇2
<!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=gb2312" />
<title>无标题文档</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="../js/lib/class.js"></script>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
//jQuery.Class
// It provides class level inheritance and callbacks.
// @author:mawei
// @date:2013/07/05
$.Class.extend('Test.Suber1',
{
init:function(){},
addName:function(name)
{
this.name = name;
this.name1 = name;
},
getName:function()
{
alert("Suber1.name="+ this.name + "\n" + "Suber1.name1="+ this.name1 );
return this.name;
},
test:function()
{
}
});
Test.Suber1.extend('Test.Suber2',
{
init:function(){},
addName:function(name)
{
this._super("addName","我是第一个类");//调用父类方法
this.name = name;
this.name2 = name;
},
getName:function()
{
this._super("getName");
alert("Suber2.name="+ this.name+ "\n" + "Suber2.name2="+ this.name2 );
return this.name;
}
});
Test.Suber2.extend('Test.Suber3',
{
name:function(){},
age:11
},
{
init:function(){},
addName:function(name)
{
this._super("addName","我是第二个类");//调用父类方法,在父类方法继续调用父类
//this._super("test"); //调用父类任意方法
this.name = name;
this.name3 = name;
//setTimeout(this.callback("test"),100);
},
test:function(name)
{
},
getName:function()
{
this._super("getName");
alert("Suber3.name="+ this.name+ "\n" + "Suber3.name3="+ this.name3 );
alert("继承特性：相同属性替换，相同方法覆盖，\n\t相同方法子类可调用父类，父类还可以调用父类,\n\t最终实现子类的多级继承");
}
});
function ShowExample(){
var son = new Test.Suber3();
son.addName("我是第三个类");
son.getName();
}
</SCRIPT>
<input type="button" value="ShowExample" onclick="ShowExample()">
<input name="login" class="login_input" style="
width: 189px;
position: absolute;
left: 300px;
">
</body>
</html>
