Ext.js4.2.1 Ext.Loader

一：描述
Ext.Loader在ExtJs4+中是動態載入的核心。一般透過Ext.require（）使用。Ext.Loader同時支援同步和非同步載入方式。

二：非同步載入

優勢：

1.支援跨域訪問

2.不需要Web伺服器，可透過檔案系統協議執行程式 如： file://path/to/your/index.html

3.方便除錯

劣勢：

1.必須事先指定依賴

使用方法：
//單個類的別名
Ext.require('widget.window');
//單個類
Ext.require('Ext.window.Window');
//多個別名，多個類
Ext.require(['widget.window', 'layout.border', 'Ext.data.Connection']); 
Ext.require(['widget.*', 'layout.*', 'Ext.data.*']);


三：同步載入

優勢：

1.1.不需要事先指明依賴，只需要事先包含ext-all.js即可

劣勢：

1.不便於除錯，除非使用Firebug

2.不能跨域請求，因為XHR的限制必須是相同域名

3.必須有Web伺服器

使用方法：可以遵守一個簡單的法則 用Ext.create代替new關鍵字來例項化物件
如：Ext.create('widget.window', { ... }); 或 Ext.create('Ext.window.Window', {});

另外可採用混合載入的模式結合同步和非同步載入的優勢

四：引數

1.disableCaching:Boolean

禁止快取js檔案，預設為true

如果我們設定DisableCaching等於true則在傳送請求時自動新增一個以DisableCachingParam屬性值為引數名(如果DisableCachingParam值為空則預設為”_dc”)，值為當前時間的引數。這樣能有效的與快取搭配工作。

2.disableCachingParam:String

快取引數，預設為'_dc'

3.enabled:Boolean

是否開啟動態載入，預設為false

如：
Ext.Loader.setConfig({  
   enabled: true,  
   paths : {//'類名字首':'所在路徑'  
      'App.ux' : 'lib'  
   }  
});


Ext.require(['App.ux.MusicWin']);//透過匹配會自動載入'lib/MusicWin.js'
注意Ext.require裡面是App.ux下面的MusicWin.js檔案

MusicWin.js程式碼：
Ext.define('App.ux.MusicWin',{  
    play : function(){  
        alert('playing...');  
    }  
});


4.garbageCollect:Boolean


5.paths:Ojbect
檔案與名稱空間的對映


五：方法

1.addClassPathMappings 

className:path mappings 類似於引數paths

2.exclude

其簡寫形式為 Ext.exclude

3.require

其簡寫形式為 Ext.require

4.onReady(fn,scope,withDomReady)

新增一個listener,當所有指令碼載入完成後，執行監聽器中的內容。

5.setConfig(config)

設定loader的引數，此方法應在ext-*.js載入之後，Ext.onReady之前被呼叫。

如：  Ext.Loader.setConfig({
enabled : true,
disableCaching : true,
paths : {
'Ext.ux.desktop' : '../desktoplib',
"MyDesktop" : '../modules'
}
});

Ext.require(...);

var startup;
Ext.onReady(function() {
startup = Ext.create("MyDesktop.StartUp");
startup.loadDesktop();
});

6.syncRequire(expressions,[fn],[scope],[excludes])
同步載入指定的類和它們的直接依賴，載入完成後，執行相應的回掉函式。

別名為syncRequire.