Ext4.x 之了解基本体系结构

对于ExtJS4.x版本，对原始ExtJS3.x版本进行大量的底层重构，但是对于最基本的前端底层体系结构任何JS框架都不会轻易改变.下面就简单普及下前端知识吧。

对于编码层次的体系设定(经典的三层架构)：

    第一， base层 (框架通用基础层,一般会对JS原生对象扩展很多好用的方法)

    第二，commons层 (框架的通用UI组件层, 一般会实现很多通用的组件 ,提供给page层调用)

    第三，page层 (页面展现层,这个就是根据具体的业务逻辑自己去实现了)

嗯 ，这里要说的事儿其实很简单呢！加入你做过前端开发，很容易理解，如果不理解的话推荐网上找找资料或者看下相关的技术书籍。

也就是说我们在设计自己的前端架构时候只需要按照这个套路就可以写出自己的JS库。

嗯当然对于base层一般不会去用纯js去写，应该使用比较成熟的库作为base，

例如（YUI、JQuery），然后把一些能封装的自己封装下以便于更舒爽的被开发者所使用。

common层呢就是希望能写一些通用的组件，比如accordion菜单、下拉框、UI表格等等

（当然你可以理解Ext的组件其实就是这一层面上，他自己的组件都是按照自己的一套面向对象基础架构去扩展的）。

page层就没什么可说的了，我们在真正编写JSP页面的时候（哦首先说明我是搞java的）可以直接使用这些common组件。

详细说下base层都需要做些什么事儿，主要分三点吧。

    第一点，就是对原生javascript对象和方法的扩展。

    第二点，对于偏向UI框架体系的JS库，封装一系列DOM操作也是必然。

    第三点，框架对于事件的支持，必须实现一套完全屏蔽浏览器差异的事件体系。

嗯，有了这个基础知识普及，那么Ext的基础架构其实就是做的这些事儿

1：首先肯定要说的就是Ext基本文件。在4.x版本中提供了俩个基本文件Ext.js和Ext-more.js,位置在源码包下(src下)

Ext.js中提供了一个Ext框架最基本方法，Ext中几乎所有的扩展都采用这个方法，那就是大名鼎鼎的Ext.apply了，

呵呵，此apply并非函数原生的apply方法,不是为了绑定作用域。

这个方法提供了对于对象的扩充功能，这个方法的实现非常的简单且经典(原因是实现的很严谨)

     Ext.apply = function(object, config, defaults) {
        if (defaults) {
            Ext.apply(object, defaults);
        }

        if (object && config && typeof config === 'object') { 
            var i, j, k;
            // 就是一个枚举 然后进行对象属性的copy，把新的属性赋给这个对象而已 如果属性重复就覆盖掉
            // 如果你不理解的话 需要补一补JS基础了，对象的天然hash特性
            //（也就是key不能重复 YUI早期有个去除数组中的重复项的方