入門導向

          Ext的新手用戶可以通過下列不同的途徑獲取學習資源:API文檔、維基百科全書、日益豐富的教程、論壇、IRC頻道等等(參閱Learn ),關于這些各個方面在EXT官網上都有。但最重要的可用資源,可以說是Ext源代碼本身。可以這樣方便地學習源代碼(Ext的項目畢竟是開源的),不僅能助你體驗Ext,而且還能讓你接觸到大量的Javascript高級技巧和最佳實踐,進一步提升自身的編碼水平。

          揭示源代碼

          Javascript是一門解釋型的語言,意味著在運行之前代碼是沒有經過編譯的。按照這種理論,在你網站上所發播的Ext代碼是我們看的懂的(human-readible)。我這里說“理論上”,是因為實際情況中,很多源代碼是經過某些自動化步驟的處理,生成很小幾行的文件最終發布的,通過剔除空白符號和注釋,或混淆等的方法,以減小文件大小。

          仔細看看EXT標準源碼ext-core.js,你會發現這是一段超長的源碼。這是剛才提及的自動化步驟生成的結果--對瀏覽器來說不錯!可是對于我們是難以閱讀的。

          ext-core.js

          /*
          * Ext JS Library 1.1
          * Copyright(c) 2006-2007, Ext JS, LLC.
          * licensing@extjs.com
          *
          * http://www.extjs.com/license
          */
           
          Ext.DomHelper=function(){var _1=null;var _2=/^(?:br|frame...
           
          Ext.Template=function(_1){if(_1 instanceof Array){_1...
          ...

          接著看下去的是ext-core-debug.js (注意在文件名后面加上-debug的JS文件), 我會發現是全部已格式化好的源代碼。這個文件是配合調時器所使用的,像Firebug的工具能夠可以讓你一步一步地、一行一行地調試代碼。你也會發現文件的體積將近大了一倍之多,這便是沒有壓縮或混淆的緣故。

          ext-core-debug.js

          /*
          * Ext JS Library 1.1
          * Copyright(c) 2006-2007, Ext JS, LLC.
          * licensing@extjs.com
          *
          * http://www.extjs.com/license
          */
           
          Ext.DomHelper = function(){
          var tempTableEl = null;
          var emptyTags = /^(?:br|frame|hr|img|input|link|meta|range|spacer|wbr|area|param|col)$/i;
          var tableRe = /^table|tbody|tr|td$/i;
          ...

          該調試版本可以在調試階段方便地檢查EXT庫運行到哪一步,但是你還是會錯過一個有價值的...代碼注釋!要完整地看到代碼,就要閱讀真正的原始代碼!

          發布Ext源碼時的一些細節

          你在download得到的壓縮文檔,包含在這些文件夾之中的,有一source的子目錄。在這個文件夾里面,正如所料,是全部的EXT的源文件,遵從Lesser GNU (LGPL) 開源的協議。對于EXT開發者來說應該非常適合。

          用你日常使用文本編輯器打開源代碼的任意一個文件(推薦有高亮顯示的編輯器,或是在這里full-featured IDE看看),便可以開始我們的探險!

          我應該從哪里開始?

          Ext代碼庫里面包含了許多各種各樣的文件,甚至令人覺得有點望而生畏。好在,Ext是一個通過充分考慮后而設計的JavaScript庫,--在底層的代碼為各項應用提供穩健的基礎如跨瀏覽器的各種DOM操控,使得在上層的類classes運行于一個較高級的抽象層面(class 一術語與我們已習慣的Java和C++語言稍微有所不同,但一些概念如繼承則可是如此類推去理解的--有關面向對象的JavaScript的更多資料,請參見Introduction to object-oriented (OO) JavaScript)。

          這意味著,當瀏覽源碼的時候,采取“自頂向下(bottom-up)”還是“自下向頂(top-down)”的方式,都是無關緊要的。你所熟悉API里面的代碼已經是屬于最高的抽象層面的范疇,你可以根據你的興趣,順著這些你熟悉的API逐步深入。但是你若贊同我的看法,并打算深入了解其個中原理,最理想的地方是從底層代碼開始。

          適配器Adapters

          瀏覽器讀取第一個源文件,當中的一個任務就是創建Ext對象本身。 Ext.js

          Ext = {};

          Ext成型于YahooUI的Javascript庫的擴展。在當時,Ext須依賴YUI的底層代碼來處理跨瀏覽器的問題。現在ExtJS已經是獨立、免依賴的庫了(standalone ),你可將YUI替換為另外你所選擇javascript庫,如prototype、jQuery、或者是這些之中的最佳選擇,-Ext自帶的底層庫。 負責將這些庫(包括Ext自帶的底層庫)映射為Ext底層庫的這部分代碼,我們稱之為適配器(Adapters)。這部分源碼位于source/adapter的子目錄。當項目引入Ext的時候便需要選擇好你準備使用的適配器。

          核心Core

          source/core中的文件是構建于適配器API之上的“相對”最底層的源碼。有些的源碼甚至“底層”到直接為獨立庫的代碼直接使用。這意味著應先了解和學習這整個庫,再學習剩余的部分也不遲。要了解Ext的各種“Magic”和核心層面,就應該把重點放在source/core目錄下的各個源代碼。

           

          posted on 2008-05-14 14:16 caihaibo 閱讀(206) 評論(0)  編輯  收藏 所屬分類: ext
          主站蜘蛛池模板: 汝阳县| 青海省| 衡阳市| 通道| 石狮市| 克拉玛依市| 华阴市| 东平县| 平顶山市| 元阳县| 互助| 定州市| 富裕县| 上饶市| 阜南县| 根河市| 通化市| 高邑县| 报价| 垫江县| 巴塘县| 遂溪县| 诏安县| 翁牛特旗| 肃南| 府谷县| 安溪县| 正宁县| 焦作市| 奎屯市| 左贡县| 庄河市| 都匀市| 铜陵市| 桂东县| 昌黎县| 怀来县| 双鸭山市| 上饶市| 红安县| 永兴县|