01ExtJs的新特性

ExtJs的新特性
1、js类的声明和对象的创建
	//类的声明其实就是一个function
	function user(){
		//相当于java的public
		this.Name = 'cat';
		this.age = 26;
		//相当于高级语言中的private(外界无法访问)
		var email = 'ycf@126.com';
		this.getEmail = function(){
			return email;
		}//此时可以访问
	}
	var u = new user();
	alert(u.getEmail());||alert(u.name);

	另外方式（json格式）：
	var person = {name:'ydf',age:26}
	alert(person.name+" "+person['age']);


2、原始方法用ExtJs创建一个window
	(function(){
		Ext.onReady(function(){
			//传统方式创建对象
			var win = new Ext.window.Window({
				width:400,
				height:300,
				title:'cat'
			});
			win.show();
		});
	})();


3、利用一个按钮触发window窗体，了解ExtJs的事件机制
	//1>得到那个按钮的dom对象
	//2>为按钮对象添加单击事件
	//3>单击的时候调用对象win的show方法
	Ext.get("mybutton").on("click",function(){
		win.show();
	});


4、用ExtJs4.0的create来创建window
	//别名
	var o = {
		say:function(){
			alert(1);
		}
	}
	var fn = Ext.Function.alias(o,'say');
	fn();//此时fn相当于全局变量
	
	var win = Ext.create('Ext.window.Window',{
		width:400,
		height:300,
		title:'cat'
	});//推荐使用
	win.show();


5、利用define自定义类并且集成（extend）window
	//自定义类,注意是类而不是对象
	Ext.define("myWin",{
		extend:'Ext.window.Window',
		width:400,
		height:300,
		title:'cat',
		newTitle:'new cat',
		mySetTitle:function(){
			this.title = this.newTitle;
		}
		//初始化的方法
		initComponent:function(){
			this.mySetTitle();
			this.callParent(arguments);
		}
	})
	//实例化，第一个参数是类名
	Ext.create("myWin",{
		title:'my win'//结果显示的是‘new cat’
	}).show();


6、requires js的异步加载//只有在需要的时候才加载相关内容，大大提高运行速度
	//在主程序中声明一个命名空间
	(function(){
		Ext.Loader.setConfig({//启用
			enabled:true,
			paths:{//命名空间
				myApp:'code/ux'
			}
		});
		Ext.onReady(function(){
			Ext.get("myButton").on('click',function(){
				Ext.create('myWin',{
					title:'my win',
					requires:['myWin']//将类先引入到实体的创建中来
				}).show();
			});//访问时只显示静态页面，点击按钮才出现window
		});
	})();


7、config 自动的get和set
	//使用config后所有配置项(定义在config中的)会自动生成get和set,不再需要如下操作
		//mySetTitle:function(){
			//this.title = this.newTitle;
		//}
	Ext.define("myWin",{
		extend:'Ext.window.Window',
		config:{//扩展配置项
			price:500
		}
	});
	Ext.get("myButton").on("click",function(){
		var win = Ext.create("myWin",{
			price:600,
			requires:['myWin']
		});
		alert(win.getPrice());//显示600
	})


8、mixins 类的混合//相当于多继承
	Ext.define("say",{
		cansay:function(){
			alert("hello");
		}
	});
	Ext.define("sing",{
		cansing:function(){
			alert("sing");
		}
	});
	Ext.define("user",{
		mixins:{
			say:'say',
			sing:'sing'
		}
		//或者这么写效果一样：extend:'say'但是extends是单继承
	});
	var u = Ext.create("user",{});
	u.cansay();
	u.cansing();
	//组件可以细化，相当于零件组装，达到低耦合