|
它的對象模型可以大概表示如下：
設計初期的對象圖
注意到 Dependency 實際上并沒有做什么事，而 Queue 的兩個方法可以分別交給 TaskManager & Task 來負責。一個方法到底由哪個對象負責，是很容易引起爭論的話題，不在我們的討論范圍內。這次，我們的重點是，采用 JavaScript 實現(xiàn)這個組件，結合 JavaScript 獨特的語言特性，我們設想實現(xiàn)上述四個對象：
- TaskManager 直接通過對象 (Object) 實現(xiàn)。在 JavaScript 的世界，對象可以作為天然的靜態(tài)類來使用——你可以直接在“類” ClassObject 里面定義屬性方法 property，并以靜態(tài)類的方式來引用 CassObject.property.
- Queue 以數(shù)組 (Array) 的形式體現(xiàn)出來，Task 則是數(shù)組中存放的每一項。對 Queue 進行操作必然要在其 prototype 中定義一些實例方法，由于每個 Queue 實例都是原生的數(shù)組，為了減少對 Array.prototype 的侵入，我們可以考慮將這些方法定義到 Task.prototype 上——將職責轉移到任務上。
將三個 Queue 數(shù)組集結在一起，形成一個“大數(shù)組”以表示三個不同優(yōu)先級的隊列，這個大數(shù)組可以作為 TaskManager 的屬性。
- 任務的核心是一個 function, 本來可以直接用 function 來表示一個任務，但考慮到它具有自身獨特的屬性（優(yōu)先級、依賴等等），而且是最經常被操作的對象，以后可能還會進行擴展，所以我們決定單獨將其定義成對象。
- 依賴直接以數(shù)組的形式作為 Task 的一個屬性存在——Task 將依賴的其他多個 Task 標識符放在這個數(shù)組中，不再單獨定義這個對象。
分析下來，局勢逐漸明朗——我們需要將四個對象簡化成兩個：TaskManager & Task, 另外兩個對象用原生的數(shù)組來實現(xiàn)：
簡化后的對象模型
又注意到這里多次以數(shù)組來實現(xiàn)，而編碼過程中必然涉及到數(shù)組的遍歷、查找等操作，JavaScript 1.6 已經為我們實現(xiàn)了這些數(shù)組操作。為了充分利用數(shù)組內置的原生方法，又能在較老的瀏覽器中運行，我們使用了 Eric 的代碼。這樣，我們可以直接使用諸如 forEach/indexOf 等方法，更關注組件的功能實現(xiàn)，而且在現(xiàn)代瀏覽器中獲得較好的性能。
~~~~~~~~~~~~~ 八卦分割線 ~~~~~~~~~~~~~
嗯，在嚴肅地分析了組件設計之后，就要踏上快樂的編碼實現(xiàn)之旅了。別急，TaskManager 似乎俗氣了一點：不足以表達具有優(yōu)先級、依賴管理的任務隊列，而且用它做命名空間有跟其他代碼沖突的可能性。好吧，這個組件就叫 Smart Queue 吧，響亮而又獨特.^^
分析設計好了，名字也有了，欲知具體實現(xiàn)過程，且聽下回分解。
原文：http://ued.alipay.com/?p=1118
本文鏈接：http://www.95time.cn/tech/web/2009/7023.asp 
出處：Alipay UED
責任編輯：bluehearts
上一頁 JavaScript組件之旅:分析和設計 [1] 下一頁
◎進入論壇網頁制作、WEB標準化版塊參加討論，我還想發(fā)表評論。
|
第 1 頁 
第 2 頁 JavaScript組件之旅:分析和設計 [2]
