在Ext2.0中，Component是一切Widget的父类，所有的Widget都继承与它，而他又继承自Observable,因此，它天生就具备了对于事件的处理能力。
首先，让我们看一下它的构建器，它的构建器可以传入三种类型的对象： 对象(该对象的initailConfig属性为真正的配置对象;isAction属性决定了该参数是否是一个Ext.Action对象，如果是Ext.Action对象则注册Component对象）、Ext.Element对象和字符串对象。如果是Ext.element对象或是String对象，Component会在构建其对象中把他们转换为配置属性对象：
Ext.Component
=
function
(config)
{
config = config || {};
if(config.initialConfig){
if(config.isAction){ // 如果配置属性对象是Ext.action对象
this.baseAction = config;
}
config = config.initialConfig; // component cloning / action set up
}else if(config.tagName || config.dom || typeof config == "string"){ // element object
config = {applyTo: config, id: config.id || config};
}
/*
从以上的代码可以看出，Config对象的结够应该如下所示：
{
applyTo:
,
id:,
initialConfig:{},
isAction:boolean
}
*/
this.initialConfig = config;
Ext.apply(this, config);
Ext.ComponentMgr.register(this);//向ComponentMgr中注册自己
Ext.Component.superclass.constructor.call(this);//调用父类的构建器
//在Action中注册自己
if(this.baseAction){
this.baseAction.addComponent(this);
}
this.initComponent();
// Component还注册了以下的事件，换句话说，所有的widget都支持以下的事件：
this.addEvents(
'disable',
'enable',
'beforeshow',
'show',
'beforehide',
'hide',
'beforerender',
'render',
'beforedestroy',
'destroy',
'beforestaterestore',
'staterestore',
'beforestatesave',
'statesave'
);
Component还提供了对Plugin的支持，在构建过程中，Component对插件逐一的进行调用：
if
(
this
.plugins)
{
if(this.plugins instanceof Array){
for(var i = 0, len = this.plugins.length; i < len; i++){
this.plugins.init(this);
}
}else{
this.plugins.init(this);
}
}
最后，如果Config对象中配置了applyTo属性则进行applyToMarkup处理，如果配置了renderTo属性则进行renderTo属性的渲染：
if
(
this
.applyTo)
{
this.applyToMarkup(this.applyTo);
delete this.applyTo;
}
else
if
(
this
.renderTo)
{
this.render(this.renderTo);
delete this.renderTo;
}
applyToMarkup方法实际上也是间接的调用了render方法，实际上，它是对applyTo对象的 容器进行render方法的调用：
applyToMarkup :
function
(el)
{
this.allowDomMove = false;
this.el = Ext.get(el);
this.render(this.el.dom.parentNode);
}
由以上的分析，我们可以得出如下的结论：
1.如果Component的Config对象属性配置了renderTo和applyTo属性，则Component对象会在构建时立刻进行渲染；否则，渲染不会在构建时进行（这是处于性能的考虑）。
2.配置renderTo和applyTo属性的区别如下：
1）renderTo是对组件进行渲染，而applyTo是对组件的容器进行渲染；
2）applyTo对组件进行了this.el属性的设置，而renderTo未进行任何设置；
首先，让我们看一下它的构建器，它的构建器可以传入三种类型的对象： 对象(该对象的initailConfig属性为真正的配置对象;isAction属性决定了该参数是否是一个Ext.Action对象，如果是Ext.Action对象则注册Component对象）、Ext.Element对象和字符串对象。如果是Ext.element对象或是String对象，Component会在构建其对象中把他们转换为配置属性对象：
Ext.Component
=
function
(config)
{ config = config || {}; if(config.initialConfig){ if(config.isAction){ // 如果配置属性对象是Ext.action对象 this.baseAction = config; } config = config.initialConfig; // component cloning / action set up }else if(config.tagName || config.dom || typeof config == "string"){ // element object config = {applyTo: config, id: config.id || config}; } /* 从以上的代码可以看出，Config对象的结够应该如下所示： { applyTo:, id:, initialConfig:{}, isAction:boolean } */ this.initialConfig = config; Ext.apply(this, config); Ext.ComponentMgr.register(this);//向ComponentMgr中注册自己 Ext.Component.superclass.constructor.call(this);//调用父类的构建器 //在Action中注册自己 if(this.baseAction){ this.baseAction.addComponent(this); } this.initComponent(); // Component还注册了以下的事件，换句话说，所有的widget都支持以下的事件： this.addEvents( 'disable', 'enable', 'beforeshow', 'show', 'beforehide', 'hide', 'beforerender', 'render', 'beforedestroy', 'destroy', 'beforestaterestore', 'staterestore', 'beforestatesave', 'statesave' );
Component还提供了对Plugin的支持，在构建过程中，Component对插件逐一的进行调用：
if
(
this
.plugins)
{ if(this.plugins instanceof Array){ for(var i = 0, len = this.plugins.length; i < len; i++){ this.plugins.init(this); } }else{ this.plugins.init(this); } }
最后，如果Config对象中配置了applyTo属性则进行applyToMarkup处理，如果配置了renderTo属性则进行renderTo属性的渲染：
if
(
this
.applyTo)
{ this.applyToMarkup(this.applyTo); delete this.applyTo; }
else
if
(
this
.renderTo)
{ this.render(this.renderTo); delete this.renderTo; }
applyToMarkup方法实际上也是间接的调用了render方法，实际上，它是对applyTo对象的 容器进行render方法的调用：
applyToMarkup :
function
(el)
{ this.allowDomMove = false; this.el = Ext.get(el); this.render(this.el.dom.parentNode); }
由以上的分析，我们可以得出如下的结论：
1.如果Component的Config对象属性配置了renderTo和applyTo属性，则Component对象会在构建时立刻进行渲染；否则，渲染不会在构建时进行（这是处于性能的考虑）。
2.配置renderTo和applyTo属性的区别如下：
1）renderTo是对组件进行渲染，而applyTo是对组件的容器进行渲染；
2）applyTo对组件进行了this.el属性的设置，而renderTo未进行任何设置；
