命名空間(namespace)是Extjs組織代碼的一個非常精巧的方式。通過這一方式,可以將數量龐大的js代碼分類到不同的命名空間下,可以有效地解決js容易產生變量衝突的問題,讓不同命名空間下的變量和對象的取名更自由而不受同名的約束。下面看看命名空間應用的例子:
Ext.namespace("App.common.util");
App.common.util.MyFormValidater = function(){
//your code here.
}
App.common.util.DataGetter = function(){
//your code here.
}
從上面例子可以看出,一個字符串("App.common.util"),經過Ext.namespace處理之後,便能像正常的js代碼對象一樣可以任意的添加屬性(MyFormValidater 、DataGetter )。到底是什麼動作可以產生這樣的效果呢。看源代碼(以下代碼出自3.2版本):
view plaincopy to clipboardprint?
namespace : function(){
var o, d;
Ext.each(arguments, function(v) {
d = v.split(".");//以點分開字符串,得到字符串數組
o = window[d[0]] = window[d[0]] || {};//將第一個字符串數組第一個字符串作爲window對象的一個屬性
/××依次地將字符串數組中的下一個字符串作爲上一個字符串對應的對象(已經處理過)的屬性*/
Ext.each(d.slice(1), function(v2){
o = o[v2] = o[v2] || {};
});
});
return o;
}
經過上面的處理之後,我們上面的例子代碼實際上等效於:
window['App'] = {};
window['App'] ['common'] = {};
window['App'] ['common'] ['util']= {};
由於window是一個全局對象,所以:
App = {};
App.common = {};
App.common.util = {}
由上面的分析,命名空間其實就是window全局對象下面的各個對象樹(還可以定義App.common.form等等)