extjs面向对象1-JavaSript-爱易网页

extjs面向对象1

日期：2014-05-16　浏览次数：20567 次

extjs面向对象一

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
    <title></title>
    <link rel="stylesheet" type="text/css" href="../lib/ext-all.css" />
	<script type="text/javascript" src="../lib/ext-base.js"></script>
    <script type="text/javascript" src="../lib/ext-all.js"></script>
	<script type="text/javascript" src="helloword.js"></script>
</head>
<script type="text/javascript">
Ext.namespace("HB");
//使用构造方法的核心
HB.Person = function(cfg){
	Ext.apply(this,cfg);
};

Ext.apply(HB.Person.prototype,{
	print:function(){
		alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));
	}
});

HB.Person.print = function(_name,_sex){
	var person = new HB.Person({name:_name,sex:_sex});
	person.print();
}

HB.Person.print("刘梅","女");
</script>
<body>
    <h1></h1>
    
</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
    <title>在一个类级别上共享的方法</title>
    <link rel="stylesheet" type="text/css" href="../lib/ext-all.css" />
	<script type="text/javascript" src="../lib/ext-base.js"></script>
    <script type="text/javascript" src="../lib/ext-all.js"></script>
	<script type="text/javascript" src="helloword.js"></script>
</head>
<script type="text/javascript">
Ext.namespace("HB");
HB.Person = Ext.emptyFn;

Ext.apply(HB.Person.prototype,{
	name:"huangbiao",
	sex:"boy",
	print:function(){
		alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));
	}
});

//类的静态方法
HB.Person.print = function(name,sex){
	var person = new HB.Person();
	person.name = name;
	person.sex = sex;
	person.print();
}
</script>
<body>
    <h1></h1>
    
</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
    <title></title>
    <link rel="stylesheet" type="text/css" href="../lib/ext-all.css" />
	<script type="text/javascript" src="../lib/ext-base.js"></script>
    <script type="text/javascript" src="../lib/ext-all.js"></script>
	<script type="text/javascript" src="helloword.js"></script>
</head>
<script type="text/javascript">
Ext.namespace("HB");

HB.Person = function(cfg){
	Ext.apply(this,cfg);
};

Ext.apply(HB.Person.prototype,{
	job:"无",
	print:function(){
		alert(String.format("姓名:{0},性别:{1},工作:{2}",this.name,this.sex,this.job));
	}
});

HB.Student = function(cfg){
	Ext.apply(this,cfg);
}

//继承代码的核心，学生继承Person类，并且给Person类的job字段赋值
//后面的job字段一定要赋值，否则会出现语法错误，脚本不继续执行
Ext.extend(HB.Student,HB.Person,{
	job:"学生"
});
//cfg为Student的初始化数据
var cfg = {name:"huangbiao",sex:"boy"};

var student = new HB.Student(cfg);
student.print();


HB.Teacher = function(cfg){
	Ext.apply(this,cfg);
}
Ext.extend(HB.Teacher,HB.Person,{
	job:"老师"
});
var cfg1 = {name:"liumei",sex:"girl"};
var teacher = new HB.Teacher(cfg1);
teacher.print();
</script>
<body>
    <h1></h1>
    
</body>
</html>

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

extjs面向对象1

相关资料更多>

推荐阅读更多>