Dojo學習筆記(1. 模塊與包)
Intro:
Dojo是一個非常強大的面向對象的JavaScript的工具箱, 建議讀者能夠去補充一下JavaScript下如何使用OO進行編程的, 這對于你以后閱讀Dojo Source有很大的用處
請大家下載dojo 0.3.1, 以下的說明均針對此版本
翻譯自http://manual.dojotoolkit.org/WikiHome/DojoDotBook/BookUsingDojo
Getting Started
1: 把Dojo加入到我們的Web程序中
1. 標志
<script type="text/javascript">
djConfig = 
{ isDebug: false };
</script>djConfig是Dojo里的一個全局對象, 其作用就是為Dojo提供各種選項, isDebug是最常用的屬性之一, 設置為True以便能夠在頁面上直接看到調試輸出, 當然其中還有些屬性與調試有關, 這里就不羅索了
2. 引用 dojo 的啟動代碼
<script type="text/javascript" src="/yourpath/dojo.js" />
這樣你就引用了dojo的代碼, 并可以直接使用其中部分常用的對象, 下載下來的dojo.js是壓縮(remove comments and space)后的代碼, 要閱讀的話,建議閱讀dojo.js.uncompressed.js, dojo.js大概有127K, 而未壓縮前有211K, ok, 為什么會這么大呢, 原來其已經把部分常用的模塊整合進dojo.js里, 因此顯得大了一點, build.txt里就說明了默認的dojo.js包含了哪些模塊
3. 聲明你所要用到的包
<script type="text/javascript">
dojo.require("dojo.math");
dojo.require("dojo.io.*");
dojo.require("dojo.widget.*");
</script>
你就把這些代碼當成是java的import語句或C#中的using語句一樣, 如果你不require的話, 而模塊本身又沒有整合在dojo.js中, 是會出現腳本錯誤的喔
2. 針對不同需求提供的預整合包
Dojo 本身是由許多模塊所組合而成的, 但是由于用戶需求的多樣性, dojo針對不同的需求而提供了不同的版本, 用戶在下載dojo的時候就看見可以選擇很多的版本, 比如Ajax版和Widget版, 每個版本最重要的區別就在于dojo.js文件, 但是除此之外, 每一個版本都是全功能的, dojo.js根據版本的不同而整合進了不同的模塊
3. 直接獲取Dojo的最新源代碼
首先你必須安裝 Subversion, 當Subversion在你的電腦上能夠正常工作后,你就可以通過如下命令下載dojo的源代碼:
svn co http://svn.dojotoolkit.org/dojo/trunk/
這會在你的當前目錄下創建一個 trunk 的目錄; 如果你希望直接Get到當前目錄, 用這個命令:
svn co http://svn.dojotoolkit.org/dojo/trunk/ .
或者你希望Get到當前目錄下的 MyDir 目錄, 用這個命令:
svn co http://svn.dojotoolkit.org/dojo/trunk/ MyDir
模塊與包
模塊
Dojo的代碼被劃分為邏輯單元稱之為模塊, 這有點類似于Java中的package,除了dojo的模塊能夠包含類 (類似于java中的classes)和簡單函數
比如: 模塊"dojo.html"包含了一系列的函數, 比如dojo.html.getContentBox(), 模塊"dojo.dnd"包含了一系列的HtmlDragObject的類
注意名稱約定, 函數的首字母為小寫字母,類的首字母為大寫
模塊也可以稱之為"命名空間"
包
在多數情況下, dojo的模塊只需要定義在一個文件就可以了, 但有時, 一個模塊可能劃分到多個文件, 比如: 模塊dojo.html, 本來是定義在一個文件中, 可是由于功能的增強, 文件逐漸變大, 我們不得不將其拆分為多個文件, 這主要是為性能考慮, 以便瀏覽器可以只下載其需要用到的代碼, 不幸的是其實現細節對于dojo的用戶看起來不那么透明, 你必須知道你想要用到的功能到底是包含在哪個文件, 然后才能require并使用它
這樣的每一個文件都稱之為一個包
dojo.require("dojo.html.extras")
將引用文件 src/html/extras.js, 這將定義模塊 dojo.html 的若干(并非所有)函數
據我所知, 盡管單個文件可以定義包里的多個類, 單個腳本文件不能定義多個模塊 (在Java可以等效于在一個文件中定義2個類), 并且, 包的名稱和模塊的名稱可以不同, 比如: 包dojo.widget.Button定義了dojo.widget.html.Button
基本上你應該這樣認為, 包和模塊盡管密切相關, 但是是兩個完全不同的實體
為什么會有模塊和包這樣的概念?
為什么會有模塊和包這樣的概念? 為了滿足你的應用程序只需要加載其所用到的東西的需求, 充分利用模塊化設計的優點, dojo維護了最小的足印以便仍能提供你所需要的功能, 為什么要你的用戶浪費時間去下載用不到的JavaScript, 當一個包就是一個js文件時, 一個模塊本質上就是一個命名空間, 比如: dojo.style 或 dojo.html.extras
多數簡單情況下, 一個包包含了一個模塊, 但更常見的是, 一個模塊可能被拆分為幾個包文件
利用包和模塊, 將能確保你能夠交付最相關的功能代碼, 最小程度的減少代碼的膨脹和消除由此帶來的不好的用戶體驗,這就是模塊設計的主要目標, 通過模塊化, 你能夠引入自定義模塊(你自己擁有的 JavaScript 工具), 并且維護模塊對于核心代碼庫基本不會產生什么影響
另外, Dojo的模塊系統也提供了內建的機制來使用代碼提供命名空間, 比如, 通過模塊dojo.event定義的Dojo的事件系統
怎樣引用
設置引用語句
你怎樣才能知道該引用哪個包到dojo.require()?
1. 模塊
首先, 確定你要使用什么模塊, 這個例子我們假定你要使用 dojo.lfx.html
2. 包
搜索代碼后你發現dojo.lfx.html定義在2個文件:
- src/lfx/html.js
- src/lfx/extras.js
根據你要用到的功能, 你可以
dojo.require("dojo.lfx.html");
或
dojo.require("dojo.lfx.html");
dojo.require("dojo.lfx.extras");
通配符
新用戶可能會對dojo.lfx.*這樣就可以替代上面2句而感到詫異, 實際上, __package__.js 中已經定義了通配符可以代替的語句, 并且這樣可以讓dojo根據當時的環境而決定加載具體的模塊