Ext.js Class 系統(tǒng)

Ext JS 是一個 JavaScript 框架，它具有面向?qū)ο缶幊痰墓δ堋?/span>
Ext 是封裝 Ext JS 中所有類的命名空間。 

在 Ext JS 中定義類

Ext 提供了 300 多個類，我們可以用于各種功能。

Ext.define（）用于在 Ext JS 中定義類。

語法:

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

類名稱是根據(jù)應(yīng)用程序結(jié)構(gòu)的類名稱。 appName.folderName.ClassName
studentApp.view.StudentView。

類屬性/成員 - 定義類的行為。

回調(diào)函數(shù)是可選的。 當類正確加載時，會調(diào)用它。

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'
   }]
});

創(chuàng)建對象

像其他基于 OOPS 的語言一樣，我們也可以在 Ext JS 中創(chuàng)建對象。

不同的方式創(chuàng)建對象在 Ext JS。

使用 new 關(guān)鍵字:

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 我們添加在控制器中，我們聲明所有其他類，如存儲，視圖等。在這種方式，我們可以調(diào)用 DepartmentUtils 類，并在控制器或在這個應(yīng)用程序中使用其功能。