EXT JS入门和面向对象编程

1、引入EXTJS

<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css"></link>
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>

2、helloworld 弹出框

	function fn(){
		Ext.MessageBox.alert("hello","HelloWorld");
	}
	Ext.onReady(fn);

3、命名空间和类。和C++ C#类似

注意：js本身并不支持命名空间，这里只是对象的级联.

	Ext.namespace("Ext.myModel");
	Ext.myModel.Student = Ext.emptyFn; //空的方法
	Ext.apply(Ext.myModel.Student.prototype,{
		name:"gaotong" //赋默认值
	});
	
	var stu = new Ext.myModel.Student();
	alert(stu.name);
	stu.name="从此醉";
	alert(stu.name);

3、定义方法和 字符串输出。

标量写法,JSONf写法

	Ext.apply(Ext.myModel.Student.prototype,{
		name:"", //赋默认值
		age:0,
		print:function(){
			alert(String.format("name:{0},age:{1}",this.name,this.age));
		}
	});

4、支持类静态方法

定义：在一个类级别上的共享方法.

Ext.myModel.Student.getConn = function(){
alert("这是静态方法");
}

5、构造方法

	Ext.myModel.Student = function(_cfg){
		Ext.apply(this, _cfg);
	}
	Ext.apply(Ext.myModel.Student.prototype,{
		name:"", //赋默认值
		age:0,
		print:function(){
			alert(String.format("name:{0},age:{1}",this.name,this.age));
		}
	});

var stu = new Ext.myModel.Student(  {name:"gaotong2",age:22}  );

6、类继承

StudentImpl 继承 Student

	Ext.myModel.Student = function(_cfg){
		Ext.apply(this, _cfg);
	}
	Ext.apply(Ext.myModel.Student.prototype,{
		name:"testExtend", //赋默认值
		age:0,
		print:function(){
			alert(String.format("name:{0},age:{1}",this.name,this.age));
		}
	});
	
	Ext.myModel.StudentImpl = function(_cfg){
		Ext.apply(this, _cfg);
	}
	Ext.extend(Ext.myModel.StudentImpl, Ext.myModel.Student, {
		job:"student1",
		print:function(){
			alert(String.format("name:{0},age:{1},job:{2}",this.name,this.age, this.job));
		}
	} );

7、事件

例如对于setName(_name)

要继承 Ext.util.Observable

1; fireEvent("nameChange", this, this,name, _name)

2; this.addEvents("nameChange");

3; person.on("nameChange", function(_person, _old, _new){

//do something

});