6、ExtJs——Ext基础架构--认识Ext.js和Ext-more.js
认识Ext.js 和Ext-more.js
首先,我们要知道这2个js文件的作用,这俩个文件包含了Ext的一些基础定义、基本的属性和方法,
•Ext.js方法详解:
– Ext.apply&Ext.applyIf
– Ext.extend
– typeOf
– isEmpty、isIterable、isFunction、isArray...
– Iterate
•Ext-more.js方法详解
– getBody
– getHead
– getDoc
– getScrollBarWidth
– destroy
Ext的apply和applyIf方法:
Ext.onReady(function(){
//Ext.js
// Ext.apply() //:就是为对象扩展属性或方法的var src = {name:'zhangsan',age:30}; //源对象var config = {name:'lisi',sex:'男'}; //配置对象//------------------------------------------------ /**Ext.apply(src,config);//name:lisi age:30 sex:男 ,apply:config会覆盖srcfor(var attr in src){alert(attr + ':' +src[attr]);}*/
//------------------------------------------------- Ext.applyIf(src,config);//name:zhangsa age:30 sex:'男' ,applyIF:config不会覆盖srcfor(var attr in src){alert(attr + ':' +src[attr]);}
});
//Ext.extend//Ext.typeOf 和原生的javascript typeOf/**var str = '111';var num = 20;alert(Ext.typeOf(str));alert(Ext.typeOf(num));*/
// Ext.isArray();/**var arr = [1,2,3,4];Ext.iterate(arr,function(item){alert(item)});*///Ext.overrideExt.define('User',{say:function(){alert('say');}});var u = Ext.create('User');Ext.override(u,{say:function(){alert('我是覆盖后的');}});u.say();//---------------------------------------------//Ext-more.jsExt.getBody()
Ext对于原生的javascript对象进行了一些列的扩展,把握好这些扩展,能更深刻体会Ext的架构,这些扩展的js源码在src/core/src/lang目录下,
共7个
ExtJs扩展原生JavaScript
- Ext.Object
- Ext.Number
- Ext.String
- Ext.Array
- Ext.Funtion
- Ext.Date
- Ext.Error
Ext.onReady(function(){//Ext对于原生javascript对象的扩展
//-------------------------------------------------------- //Ext.Object//-----------------------------------------------------//1:chain 把当前传入的对象 当成新创建对象的原型/**var obj = {name:'dfsa',age:10 };var result = Ext.Object.chain(obj);alert(result.name);alert(result.age);alert(result.hasOwnProperty('name')); //alert false*///-------------------------------------------------------//2:each 遍历当前对象 然后回调函数中暴漏出三个属性key、value、self,如果回调函数返回false停止迭代/**var obj = {name:'zhangsa111',age:20,sex:'nan'};Ext.Object.each(obj,function(key,value,self){alert(key + ':' + value);if(obj.age == 20){return false;}});*///-------------------------------------------------------------//3:fromQueryString( queryString, [recursive] )/**var str = 'name=dsfa&age=30';var obj = Ext.Object.fromQueryString(str);alert(Ext.encode(obj));*///---------------------------------------------------------//4:getKey/**var person = {name: 'Jacky',loves: 'food'};alert(Ext.Object.getKey(person, 'food')); // alerts 'loves'*///----------------------------------------------------------//5:toQueryObjects/**var obj = {name:'张三',age:50,fav:{fav1:'sleep',fav2:'play',fav3:'eat'}};var arr = Ext.Object.toQueryObjects('user',obj,true);console.info(arr);*///----------------------------------------------------------//6:toQueryString/**var obj = {name:'zdsad',age:20};var str = Ext.Object.toQueryString(obj);alert(str); //alert name=zdsad&age=20 可以形成查询条件,即http:.../.jsp?name=zdsad&age=20*/
//---------------------------------------------------------------------------//Ext.Number//1:constrain
// alert(Ext.Number.constrain(5,1,20));//2:randomInt
// alert(Ext.Number.randomInt(1,100));//3:toFixed
// alert(Ext.Number.toFixed(3.1415926,4));//--------------------------------------------------------------------------- //Ext.String
// alert(Ext.String.capitalize('edsad'));// alert(Ext.String.ellipsis('www.asdfgh.com',8)); //alert www.a...//---------------------------------------------------------------------------//Ext.Array//1:clean/**var arr = [1,2,null,3,''];alert(Ext.Array.clean(arr));*///2:difference/**var arr1 = [1,2,3];var arr2 = [2,5,6];alert(Ext.Array.difference(arr1,arr2));*///3:each/**var arr3 = [1,2,3];Ext.Array.each(arr3,function(item){alert(item);if(item >=4){return false;}});*///4:erase 从指定位置开始删除指定数量元素
// var arr = [1,2,3,4,5];
// alert(Ext.Array.erase(arr,2,2)); //alert [1,2,5]//5:every/**var arr = [1,2,5,6,9,10];var flag = Ext.Array.every(arr,function(item){if(item >= 7){return false;}else{return true;}});alert(flag); //false*///6:filter/**var arr = [1,2,5,6,9,10];var newarr = Ext.Array.filter(arr,function(item){if(item > 8){return false;}else{return true;}});alert(newarr); //alert [1,2,5,6]*///7:include/**var arr = [1,2,3,4];Ext.Array.include(arr,20);alert(arr); //alert [1,2,3,4,20]*///8:unique/**var arr = ['a',2,3,4,5,6,5,4,3,2,'a','b'];
// alert(Ext.Array.unique(arr)); //alert[1,2,3,4,5,6]//利用js对象的特性去掉数组的重复项 利用obj的key是不重复的var obj = {};for(var i = 0,len = arr.length; i < len ; i++){obj[arr[i]] = true; //去掉数组的重复项了}
// alert(Ext.encode(obj)); var uniquearr = [];for(var i in obj){if(obj.hasOwnProperty(i)){uniquearr.push(i);}}alert(uniquearr);*///function alias bind defer//为方法起别名/**var obj = {name:'dfsafds',say:function(){alert(this.name);}};var objsay = Ext.Function.alias(obj,'say');objsay();*///bind 绑定作用域 就相当于call apply/**var color = 'red';var obj = {color:'blue'};function showColor(){alert(this.color);}Ext.Function.bind(showColor,obj)();*///defer 类似window.setTimeout/**function task(){alert('执行');};Ext.Function.defer(task,3000); //3秒后执行task*/
//------------------------------------------------------------//Date//between
// alert(Ext.Date.between(new Date(2014,07,05),new Date(2014,07,01),new Date(2014,07,09))); //alert true//format
// alert(Ext.Date.format(new Date(),'Y-m-d H:i:m'));//parse
// alert(Ext.Date.parse('2014-08-09 21:41:09','Y-m-d H:i:m').toLocaleString()); //格式年必须Y,时必须H,大写//------------------------------------------------------------------//Ext.ErrorExt.Error.raise('you are wrong');
});