Ext JS4 class manager 解析

  为了更深入的理解Ext,今天深入了解了下Ext的类加载机制.

  首先需要了解Ext.Base这个是所有Ext类的基类,包括build-in和user custom class,也就是说Ext.Base里的所有方法和属性都是可以在子类里访问到的.
  Ext.Class是一个class factory,一般很少用到他,他不所有class的基类,所所有class的工厂。可以通过这个工厂create class,但是从工厂创建的class会没有namespace,aliasing,depency loading等由class manager管理的特性.所以不要直接从Ext.Class工厂创建Class.
   接下来分析下Ext ClassManager . Ext的一大核心, ClassManager 顾名思义,就是类的管理器。所有由Ext.create同步加载进来的类会被ClassManager管理着.ClassManager里维护了一个$classes的map, key是class的string name,value就是引进来的class.(同步加载机制见下)

  另外一个Ext的核心是Ext.Loader.他是ext实现dynamic load的关键所在。Ext loader分2种模式load class

注意:如果需要dynamic load需要把enabled设置成true,因为Ext.Loader是signleton,所以没有setEnabled方法,通过Ext.Loader.setConfig({enabled: true})打开dynamic load


  * Asynchronous loading -- 异步加载
  * synchronous loading -- 同步加载

Asynchronous loading

Method 1: Explicitly include what you need:
// SyntaxExt.require({String/Array} expressions);

// Example: Single aliasExt.require('widget.window');

// Example: Single class nameExt.require('Ext.window.Window');

// Example: Multiple aliases / class names mixExt.require(['widget.window', 'layout.border', 'Ext.data.Connection']);

// WildcardsExt.require(['widget.*', 'layout.*', 'Ext.data.*']);
Method 2: Explicitly exclude what you don't need:// Syntax: Note that it must be in this chaining format.Ext.exclude({String/Array} expressions)
   .require({String/Array} expressions);

// Include everything except Ext.data.*Ext.exclude('Ext.data.*').require('*');

// Include all widgets except widget.checkbox*,// which will match widget.checkbox, widget.checkboxfield, widget.checkboxgroup, etc.Ext.exclude('widget.checkbox*').require('widget.*');

异步加载的好处：


* 可以跨域(没有实践过)
* 不需要web server支持,应用程序可以通过file system得到要加载的类
* 最佳的编程体验,错误消息会给出具体的真实file的错误地址和错误行

异步的缺点: 所有的依赖关系必须都得一次交代清楚



synchronous loading

Ext.create('widget.window', { ... }); // Instead of new Ext.window.Window({...}); Ext.create('Ext.window.Window', {}); // Same as above, using full class name instead of aliasExt.widget('window', {}); // Same as above, all you need is the traditional `xtype`

同步加载的好处： 不需要给定所有依赖的类,应为同步会到ext-all.js去找
同步的缺点：


* 调试不方便,因为他给出的错误消息是ext-all.js不是真实的file的
* 只能在同一个domain里获取
* 需要一个web server

在使用同步加载是加载类前,Ext.ClassManager会先通过class name到$classes里查看这个class是不是已经被加载过了,如果没有被加载过他就会把这个类以及他的依赖全部一次加载。

切记如果希望创建的类被Ext ClassManager管理就要用Ext.define,如果需要被引进来的类被Ext ClassManager管理就要用Ext.create不要用new