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会覆盖src
for(var attr in src){
alert(attr + ':' +src[attr]);
}
*/
//-------------------------------------------------
Ext.applyIf(src,config);
//name:zhangsa age:30 sex:'男' ，applyIF：config不会覆盖src
for(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.override
Ext.define('User',{
say:function(){
alert('say');
}
});
var u = Ext.create('User');
Ext.override(u,{
say:function(){
alert('我是覆盖后的');
}
});
u.say();
//---------------------------------------------
//Ext-more.js
Ext.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.Error
Ext.Error.raise('you are wrong');
});