extjs4学习日志（1）

新公司要求使用extjs4，在此之前我对ext框架毫无了解，最近开始学习extjs4。

我把自己学习的过程分享给大家，希望对大家有所帮助。

1、 模仿js的alert

Ext.MessageBox.alert(Hello,’Hello World!’);

2、 Extjs4对原生js的Array类的扩展

a) every(Array array,Function Fn,Object scope)：Boolean方法

参数1：数组 参数2：方法(会返回true或false) 参数3：作用域

作用：遍历传入数组的每一项，通过Fn来判断，当第一次返回false的时候，跳出。

var myArray = [1, 2, 3, 4, -5, 6];
Ext.Array.every(myArray, function (item) {
if (item > 0) {
return true;
}
else {
alert(item);
return false;
}
}, this);

执行结果是-5。

b) filter(Array array,Function Fn,Object scope)：Array方法

参数1：数组 参数2：方法(会返回true或false) 参数3：作用域

作用：通过方法Fn便利数组每一项，返回true的项留下，返回false的项被去掉，并返回新数组。

var myArray = [1, 2, 3, -3, -2, -1];
var myArray2 = Ext.Array.filter(myArray, function (item) {
if (item > 0) {
return true;
}
else {
return false;
}
}, this)
alert(myArray2);

执行结果：1,2,3

3、 Ext.create(String name,Mixed args):Object

参数1：创建的对象的类名 参数2：设置对象的参数

作用：创建类的对象。

var win = Ext.create('Ext.window.Window', {
width: 400,
height: 300,
title: '这是一个窗口'
});
win.show();

显示一个窗口。

4、 Ext.define()自定义类

Ext.define('myWindow', {
//继承自Ext.window.Window类
extend: 'Ext.window.Window',
width: 400,
height: 300,
title: '这是我自定义的window',
//任意定义一个属性
mytitle: '这是我自定义的标题',
//定义一个方法将自定义的属性复制给title
setMyTitle:function(){
this.title=this.mytitle;
},
//调用父类的构造函数（初始化）
initComponent: function () {
this.setMyTitle();
this.callParent(arguments);
}
});

Ext.create('myWindow', {}).show();

自定义一个myWindow类继承自Ext.window.Window类

5、 Config、mixins、extend配置项

a) Config相当于vs中的自动生成属性

b) Mixins配置项可以混合其他的类，是当前类的对象可以调用其他类的方法

c) Extend是继承某个类，与misins一起使用可以实现类似多继承的效果