在軟件架構中特別是B/S架構中很流行使用三層架構（數據層中間層表現層）來建立軟件但這從來都是服務器端的專利在傳統的概念中客戶端的職責就只是用來對數據進行展現而已如果說客戶端也搞三層確實是一樣不可思議的事件
為什麼要搞客戶端三層？
ExtJS這個框架是個功能很強大的框架由於它給了開發者很大的自由度跟細粒度開發者在開發的過程中配置使用一個組件需要編寫許多的代碼工作量大不說效率低可重用性低卻是致命的所以聰明的開發者應該積極利用ExtJS裡的面向對象功能簡化自己的工作定制自己的組件才能提高自己的效率所以除了在服務器端也搞三層我們也可以在客戶端搞三層定制組件簡化工作
基本知識
Extns()（或Extnamespace()函數）相信很少有人去使用這個函數這個函數用以構建一個新的命名空間概念跟C#的命名空間或Java中的包概念一樣觀察源代碼我們可以發現實際上這個函數只是建立了一個跟命名空間一樣的類而已比如Extns(buzzdatautility);就會新建一個類名稱是buzzdatautility有了這個概念我們就好辦了
實例函數與靜態函數這兩種函數的區別我就不講了主要講講如何在JS中實現用例子說明或許會比較直觀
Extns(testcls);
testcls = function() {
}
testclsstaticShow = function() {
alert(這是靜態函數);
}
testclsprototypeinstanceShow = function() {
alert(這是實例函數);
}
調用如下
var temp = new testcls();
tempinstanceShow()
testclsstaticShow()
數據訪問層
Extns(buzzdatautility);
buzzdatautilitybuildHttpStroe = function() {
return new ExtdataStore({
proxy: new ExtdataHttpProxy()
});
}
該層用於返回一個進行基本封裝的Store對象
中間層
Extns(buzzuser);
buzzuser = ExtdataRecordcreate([
{ name: PersonName mapping: name type: string }
{ name: PersonID mapping: id type: int }
]); //數據模型對應服務器端的數據模型
buzzuserload = function(url loadedCallback) {
var st = buzzdatautilitybuildHttpStroe();
stproxygetConnection()url = url;
streader = new ExtdataJsonReader({ root: data } buzzuser);
ston(load loadedCallback);
stload();
} //靜態方法用以從服務器端返回數據返回類型為buzzuser類型參數url是要調用數據的地址loadedCallback是回調函數
中間層部分我們新建了一個buzzuser類（命名空間）該類直接創建自Record對象該對象是定制的與服務器端數據模型對應的注意使用mapping進行映射而buzzuserload方法是一個靜態方法不需要實例化即可使用
表現層部分
ExtonReady(function() {
Extget(btn)on(click function() {
buzzuserload(jsonashx callback);
});
});
function callback(st res op) {
for (var i = ; i < reslength; i++) {
alert(Stringformat({}{} res[i]get(PersonID) res[i]get(PersonName)));
}
}
回調函數三個參數ststore對象resRecord數組op其它附加選項
該篇文章只作拋磚引玉的作用實際開發中還需要更多考慮的地方
From:http://tw.wingwit.com/Article/program/Java/Javascript/201311/25265.html
