Ext.js 教程：系统

Ext JS 是一个 JavaScript 框架，它具有面向对象编程的功能。
Ext 是封装 Ext JS 中所有类的命名空间。 

在 Ext JS 中定义类

Ext 提供了 300 多个类，我们可以用于各种功能。

Ext.define（）用于在 Ext JS 中定义类。

语法:

Ext.define(class name, class members/properties, callback function);


类名称是根据应用程序结构的类名称。 appName.folderName.ClassName
studentApp.view.StudentView。

类属性/成员 – 定义类的行为。

回调函数是可选的。 当类正确加载时，会调用它。

Ext JS 类定义示例

Ext.define(studentApp.view.StudentDeatilsGrid, {
extend : Ext.grid.GridPanel,
id : studentsDetailsGrid,
store : StudentsDetailsGridStore,
renderTo : studentsDetailsRenderDiv,
layout : fit,
columns : [{
text : Student Name,
dataIndex : studentName
},{
text : ID,
dataIndex : studentId
},{
text : Department,
dataIndex : department
}]
});


创建对象

像其他基于 OOPS 的语言一样，我们也可以在 Ext JS 中创建对象。

不同的方式创建对象在 Ext JS。

使用 new 关键字:

var studentObject = new student();
studentObject.getStudentName();


使用 Ext.create（）:

Ext.create(Ext.Panel, {
renderTo : helloWorldPanel,
height : 100,
width : 100,
title : Hello world,
html : First Ext JS Hello World Program
});


Ext JS 中的继承

继承是将类 A 中定义的功能用于类 B 的原理。

在 Ext JS 继承可以使用两种方法 。

Ext.extend:

Ext.define(studentApp.view.StudentDetailsGrid, {
extend : Ext.grid.GridPanel,
...
});


这里我们的自定义类 StudentDetailsGrid 使用 Ext JS 类 GridPanel 的基本功能。

使用 Mixins:

Mixins 是在没有扩展的情况下在类 B 中使用类 A 的不同方式。

mixins : {
commons : DepartmentApp.utils.DepartmentUtils
},


Mixins 我们添加在控制器中，我们声明所有其他类，如存储，视图等。在这种方式，我们可以调用 DepartmentUtils 类，并在控制器或在这个应用程序中使用其功能。