首先看一个例子,我们在ExtJS中定义一个Window对象,代码如下:
var win = Ext.create("Ext.window.Window", { title: ‘示例窗口‘, width: 300, height: 200 }); win.show();
在上面的代码中,我们通过Ext.create方法创建了一个Window 对象,Ext.create 方法的第一个参数是类名,第二个参数是类的选项,它是一个JSON格式的对象,用来初始化Window对象。我们的窗口运行如下:
试想一下,如果我们的类中有几十个属性,那么我们使用构造函数就要传入几十个参数来对它完成初始化,这是一件很恐怖的事情。还好ExtJS 为我们提供了这种便利,我们可以在定义类的时候为它添加配置项,然后调用ExtJS 内置的方法完成初始化,并可以生成访问器(类似于C#里面的get和set方法)。
我们来修改Person类,使它可以通过config初始化:
Ext.define("Person", { config: { Name: ‘‘, Age: 0, }, Say: function (msg) { Ext.Msg.alert(this.Name + " Says:", msg); }, constructor: function (config) { this.initConfig(config); } });
我们在类的定义中添加了config项,将需要在配置中完成的属性添加在里面,而在构造函数中,我们通过调用this.initConfig方法完成对config的初始化。看一下用法:
var Tom = Ext.create("Person", { Name: ‘Tom‘, Age: 26 }); Tom.Say("Hello");
我们在定义Person类对象的时候,使用Ext.create方法,传入类名Person以及配置项,然后调用Tom的Say方法,运行效果如图:
除了代码更加清晰简洁以外,ExtJS 还为我们生成了访问器,我们可以通过下面的方式访问Tom的属性:
Tom.setAge(20); alert(Tom.getAge());
ExtJS 生成了get、set方法,我们可以通过这样的方式来访问对象的属性。
时间: 2024-10-07 09:22:17