ExtJS核心工具方法

一：ExtJs的属性和获取浏览器特性

//获取浏览器属性

alert(Ext.isFF3_0);//是否为Firefox
alert(Ext.IS_FIREFOX);
alert(Ext.is.Desktop); //是否运行在桌面操作系统上

//还有Ext.is. Ext.supports.

二：onReady方法

完整语法是：

Ext.onReady(Object fn,Object scope,Object options);

如：

Ext.onReady(function(){
alert(”Ext.onReady用于监听Ext JS以及所有HTML页面是否加载完成“);
});

或

var fn = function(){
alert("我必须学习好："+this.name);
}
var type = {
name : "ExtJs"
}
Ext.onReady(fn,type);

三：Ext.defer用于指定延迟执行的函数

Ext.defer(Function fn,Number millis,[Object scope],[Array args]);

执行延迟3秒之后执行的fn函数

Ext.defer(fn,5000,type); //延迟加载

四：Ext.apply和Ext.applyIf方法

两个方法都是用于把一个对象中的属性复制到另一个对象中，都是用于属性复制。

区别是:Ext.apply()将会覆盖目标对象中的属性，Ext.applyIf只复制目标对象中没有、而源对象中有的属性不会发生属性覆盖。

如

var Java = {
name:"Web企业级开发",
salary:10000,
city:"北京"
}
var Android = {
name:"移动开发",
salary:12000,
prospect:"nice"
}
//将Android对象复制到Java对象中
Ext.apply(Android,Java);
//输出
for(var prop in Android){
document.writeln(prop+" : "+Android[prop]+"</br>" )
}

输出： name : Web企业级开发

salary : 10000

prospect : nice

city : 北京

而用

Ext.applyIf(Android,Java);

输出：name : 移动开发

salary : 12000

prospect : nice

city : 北京

apply(Object object,Object config,Object defaults);是把config、defaults两个对象复制到object中，config优于defaults

五：Ext.define()

/*Ext.define()方法用于自定义类

Ext.define(String className,Object data,[Function createdFn]);该类指定3个参数

其中className用于执行自定义类的类名，data用于定义该类属性、方法，createdFn用于指定该类创建成功后的回调函数。

如：

*/

Ext.define("ExtJs",
{
name:"ExtJs前端技术",
age:5,
study:function(){
alert("我决定学好"+this.name);
}
},function(){
alert("创建成功");
alert(this.self == ExtJs.Class);
}
);
var extjs = new ExtJs();
extjs.study();

/* 一些特殊的属性如self:引用当前类本身、alias:为该类定义别名、alternateClassName:该类定义可选的类名

config:该类指定配置选项、extend:指定该类继承的父类、inheritableStatics:与statics属性相同、

mixins:列出所有要被混入的类、override:用于注定要覆盖的类、requires:用于列出在实例化该类之前欲先加载的类

singleton：单列、statics:该类定义静态方法和静态属性、uses:列出必须与该类同时使用的类

*/

//继承问题

Ext.define("IT",{
size:30
});
Ext.define("Java",{
//定义该类继承了IT
extend:IT,
//定义构造器 （多像Java啊）
constructor:function(name,salary){
this.name = name;
this.salary = salary;
}
}
);
var java = new Java("Java高级",9999);
document.writeln("Java中的"+java.name+"</br>"+"薪水"+java.salary+"</br>"+"大小"+java.size)

//指定配置选项问题

//指定配置选项问题
Ext.define("IT",{
//指定配置选项
config:{
name:"JAVA",
salary:10000
},
//定义构造器
constructor:function(cfg){
this.initConfig(cfg);
}
}
);

//创建对象方法一
var it = new IT();
//IT类自己定义的set和get方法
it.setName("JavaScript");
it.setSalary(12000);
alert(it.getName()+" = "+it.getSalary());

输出 JavaScript = 12000

/*也可以用Ext.create()方法来创建对象

创建对象方法二

*/

var it = Ext.create("IT",{
name:"JavaScript",
salary:11000
}
);
alert(it.name+" = "+it.salary);

//定义静态属性和定义静态方法的static、inheritableStatics (我感觉越来越像Java了)

Ext.define("IT",{
//定义静态成员，这些静态成员可以被子类继承
inheritableStatics:{
desc:"互联网技术",
work:function(){
alert("互联网世界");
}
}
}
);

//调用IT的静态属性和静态方法
alert(IT.desc);
IT.work();
Ext.define("Java",
{
extend:IT
}
);
Java.work();

//Ext.isXXX判断是否为某一对象

alert(Ext.isNumber(5));    //true
alert(Ext.isEmpty("",false));   //true
alert(Ext.isDefined(window.abc));

七：

/*

Ext.each()方法用于遍历数组

Ext.iterate()方法遍历数组和对象

*/

//定义一个数组
var IT = ['Java','Android','IOS','Php'];
//遍历数组元素
Ext.each(IT,
function(name,index,arr){
document.writeln("第"+index+"本图书是："+name+"<br/>")
}
);
//定义一个对象
var book = {
name:"Java面向对象",
price:99
}
//遍历对象属性
Ext.iterate(book,
function(key,value,myself){
document.writeln(key+"--->"+value+"</br>")
}
);

第0本图书是：Java

第1本图书是：Android

第2本图书是：IOS

第3本图书是：Php

name--->Java面向对象

price--->99

八：命名空间

//创建It、It.Java、It.Java.Spring三个命名空间

Ext.namespace('It.Java.Spring');
It.info = function(name,price){
return name + price;
}
It.Java.create = function(tag){
return document.createElement(tag);
}
//调用函数
alert(It.info("JAVA面向对象",99));
alert(It.Java.create("div"));