ExtJS 中类的选项 - config

首先看一个例子，我们在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方法，我们可以通过这样的方式来访问对象的属性。