jCT 3.9.12.10 放出,大改變,文檔重新發布

SVN已經更新.最新下載：jCT最新版本

更多信息請看我博客裏的jCT專題 ，或者jCT開源主頁示例 裏面有最簡單的例子，另外我更希望感興趣的你能直接提出html代碼和需求，我們討論如何用jCT的方法寫出.

  

對於上一篇文章 jCT如何改造邊想邊發 ，jCT今天有所更新，涉及以下方面
1.模板語法
2.廢除RunNow，增改爲BRun,ERun
3.增加自動Build功能
這將造成與以前的版本不兼容

模板語法

 

針對於 jCT如何改造邊想邊發 文內提出的原 /* 的註釋模板書寫不方便（需要shift鍵，兩隻手都要敲擊鍵盤），改爲 // 開頭
功能名稱　　　 　　 　 　jCT 3.8.xxx版 　　 　　 　 　　 　　 jCT 3.9.xx版
==================================================
GetView 參數名 　 　 　　 　　 不支持 　 　　 　 　　 　 　 <!---// arg1,arg2-->
子模板定義開始 　　 　<!---/*+@name*/--> 　　 　　 　 　 <!---///name-->
子模板定義結束 　　 　<!---/*-@name*/--> 　　 　　 　 　 <!---///name-->
子模板參數 　　 　 　　 　　 　 不支持 　　 　 　　 　 　　 　<!---///name arg1,arg2-->
成員對象 　 　 　 　 　 　<!---/*+$objname*/ 　 　 　 　 　 　 <!---//.objname
成員函數 　 　 　 　 　 　<!---/*+ funName*/ 　 　 　 　 　 　 <!---//. funName function(){}
成員結束 　 　 　 　 　 　 --> 　 　 　 　 　 　 　 　 　 　 　 　 　 　 -->

==================================================
新版優點：方便錄入，更易於記憶，形式更符合javascript語法習慣,參數的傳遞更方便
其實有了擴展語法根本就不需要成員定義了,僅僅是繼承下來了
說明 : 由於模板語法的變遷，自定義語法中的member，memberend對應也無效了

廢除RunNow，增改爲BRun,ERun

因爲原來的RunNow方法不能區別Build和Extend,ExtendTo的不同時期的差別，所以廢除RunNow,改爲
BRun:在Build後自動執行
ERun:在Extend/ExtendTo後自動執行

增加自動Build功能

筆者自己也發現總是顯示的使用Build很不方便，就增加了自動Build功能，自動Build發生在GetView/GetViewContinue執行時，當執行時jCT發現並沒有Build時，會自動執行Build過程


看看 Example Online 是最快的瞭解方法


jCT 3.9.xxx 版文檔 （不兼容3.8.xxx版本）

jCT全稱 :

javaScript Common Templates   就是 javaScript 共用模板

屬於WEB開發模板技術 的一種.jCT用javaScript寫成,通常工作於瀏覽器客戶端.

基本功能 :

作爲模板技術,完成後臺數據 與htm模板(jCT模板) 的組裝,得到最終表現 代碼是jCT的基本功能.

設計理念 :

作爲模板技術,jCT僅僅負責把模板javaScript對象 化.並提供數據組裝文法.

從文法形式上看jCT的文法極其類似php,aps,jsp的文法,也就是嵌入html模板文法

這種文法,事實上是嵌入了javaScript腳本,採用完全與javaScript腳本一致 的語法來書寫模板,達到了與javaScript完全兼容.

因此jCT本身的功能並不直接參與獲取後臺數據 .與如何實施表現. 這些功能可以通過書寫模板的時候直接寫入進去,反正都是javaScript腳本.或者採取其他的手段從外部控制.

由於在實際的應用中業務行爲可能很複雜,jCT提供了子模板對象 的支持.從jCT對象的最終形式 javaScript 對象來說,這就形成了一棵對象樹 ,而且這個對象樹的組織完全是由模板代碼決定.

 

調用 :

jCT就是一個根據提供的文本模板來生成jCT實例對象的模板編譯器

而這個可以組織數據得到表現代碼的實例對象具體都做了哪些和應用有關的動作 ,完全由模板的內容決定.畢竟所有的執行代碼都在模板裏,都是使用者自己寫 的.

var instance=new jCT(txt);//構建jCT對象,僅僅準備基礎數據，txt就是模板字符串,不是指模板的url地址,是內容
instance.Build();//手工代碼進行構建，這纔是真正的自構建，當然您也可以省略不寫，因爲
var htmlsrc=instance.GetView();//如果沒有進行Build,這裏內部會自動進行Build過程

視圖 :

構建完成了，如何執行獲取模板視圖呢?

就是GetView 了，這個是用來的到模板執行後的html代碼--也就是視圖.
就像上面的代碼，htmlsrc 就是文本形式的視圖，把這個htmlsrc加載到頁面的什麼地方由你根據應用需要決定，比如

document.body.innerHTML=htmlsrc;//整個頁面就都刷新了

jCT是如何構建實例的 :

事實上,jCT並不直接構建 出完整的jCT實例 ,jCT僅僅是生成 一個可以自構建的對象 .這個對象什麼時候需要構建,什麼時候需要執行(裝配數據得到表現代碼),由使用者的代碼決定。
使用者寫的模板源碼最終會轉換成爲GetViewContinue方法的主體，GetView又調用了GetViewContinue.也就是說GetViewContinue的主體結構和模板是一致的。
在 GetViewContinue 的內部實現中，jCT採用了一個輸出緩存區數組，把所有的輸出數據push進去，最後再把數組值連接(join)成字符串輸出，這樣保持了較高的代碼執行效率。

jCT實例如何運行 :

因實例是自構建的,在實現上要保留一些成員 函數和成員對象來滿足自構建的需求.最重要的保留成員有:

1. Fn       保留對象,供jCT實例內部使用,不能對Fn已有的屬性修改.
2. Build    保留方法,模板構建 方法.
3. GetView  保留方法,獲取裝配數據後的表現代碼.
4. GetViewContinue 保留方法, 用於遞歸的調用情況, 寫入 輸出 緩存,不輸出
            事實上GetView是先清空輸出緩存,
            然後調用GetViewContinue
            最後輸出緩存
   
5. Extend   保留方法,以參數對象 擴展jCT 實例 和子jCT對象.
6. ExtendTo 保留方法,擴展jCT實例到參數對象.
7. BRun/ERun  特例方法 ,需要用戶自己實現
            方法分別在Build,Extend/ ExtendTo 中自動運行.
            稱做RunNow支持
8. ExecChilds 保留方法,執行子jCT對象的某個方法,默認是Exec方法
9. Buildchilds 保留方法,執行 子 jCT 對象的Build方法,默認所有 的 子jCT 對象
   

GetView 方法就是調用 GetViewContinue 方法的，但是GetView一開始就清空了輸出數組，因此遞歸的調用GetView是不可靠的，因爲前面的輸出都丟失了。

GetViewContinue 獨立出來的原因是GetViewContinue沒有清空輸出數組，因此變通的支持了遞歸調用。

Extend/ ExtendTo   雖然jCT模板語法上可以定義成員對象和方法，不過總是寫到模板中 ,把嵌入式javascript語句和html代碼全都混合在一起看上去很紛亂, 這兩個方法可以改善這個狀況 ,可以把 成員對象和方法定義 從html模板中分離出來，書寫到標準的javascript文件裏，以標準javascript對象出現，通過Extend/ExtendTo 把jCT實例對象和標準對象融合在一起。這樣將形成這樣的文件結構：

1. 嵌入 javasctipy代碼的 jCT 模板 文件,通常就是html文件。
      依照jCT的文法形式把子模板對象和直接的javascript代碼寫進去。
   
   
2. 把相關的成員對象和方法書寫進標準的javascript文件，並引入頁面
   例如：
   
   

   var obj={
     RNow:function(){alert('hello jCT');},
     Exec:function(D){document.body.innerHTML=this.GetView(D);}
   }
   

3. 通過1裏面的模板得到jCT實例對象後，通過Extend/ExtendTo與上面的obj對象融合到一起：比如jCT實例對象是Ins
       Ins.ExtendTo(obj); 這樣obj對象就被擴展了，具有jCT對象Ins的所有成員，當然也可以不顯示的生產Ins這個對象，也可以：
      (new jCT(src)).ExtendTo(obj);
   

jCT文法定義 :

 

jCT的有3類文法標記

1. block : 語句塊,用來書寫javascript語句，或者標示一個成員的界限
2. exp   : 取值表達式,用來書寫javascript值表達式
   
3. clear : 清理標記,用來完成一致性設計 ，
   一致性設計指的是在模板沒有被解析並執行前,僅僅在瀏覽器上打開模板源文件,就可以看到和解析並執行後一致的樣式效果
   

注意：exp 取值表達式 是不應該出現在block內的。
通過這些標記，就可以寫javascript代碼 ，定義成員函數 ，定義子jCT實例 。下面是個成員函數定義 :

<!---//.hello function(who){
alert('hello! '+who||'');
}
-->

下面是個普通成員對象定義 :

<!---//.name
'xiao qiang'
-->

下面是個子jCT實例定義 ：要注意子實例 定義要有開始，有結束 ，還可以有參數

<!---///hello who-->
<h1>hello:+-who-+</h1>
<!---///hello-->

事實上有了 Extend, ExtendTo 後 成員函數和成員對象的定義基本就用不到了

下面是個頂層jCT實例定義 ：注意 GetView參數 的定義方法，//後有一個空格，這樣寫的原因是頂層jCT實例是沒有把對象名定義在模板裏，其實和上面的子實例定義是一樣的，就是缺少了實例名稱

<!---// who-->
<h1>hello:+-who-+</h1>

jCT編譯模板階段會自動根據第一個出現的block去自動判斷採用那個文法風格
如果你有自己的想法，那就自己定義 一個風格吧。
風格在jCT.Instance.prototype.Tags 下定義 , 您可以自行修改/增添
不過block裏面的//x語法是固定的,//寫起來太方便了

Tags:{//幾種不同的模板定義風格
	comment:{//註釋標籤風格
		block:{begin:'<!---',end:'-->'},//語法塊標記
		exp:{begin:'+-',end:'-+'},//取值表達式
		clean:{begin:'<!--clean',end:'/clean-->'}//清理標記
	},
	script:{//腳本標籤風格
		block:{begin:'<script type="text/jct">',end:'</script>'},
		exp:{begin:'+-',end:'-+'},
		clean:{begin:'<!--clean',end:'/clean-->'}
	},
	code:{//code標籤風格
		block:{begin:'<code class="jct">',end:'</code>'},
		exp:{begin:'+-',end:'-+'},
		clean:{begin:'<!--clean',end:'/clean-->'}
	}
}

jCT API :

在經過上面 介紹的 概念後,這裏給出jCT的內置API接口定義

1. jCT 調用
   格式: var jctInstance = new jCT(txt,path);
   參數:
       txt  可以爲空 模板源代碼,就是一個string,不是url地址 ,
       path 可以爲空 模板源代碼文件所在路徑,這個是個實用便捷的參數,在筆者的應用裏他被子模板使用,在你的應用裏用不到的話,就忽視他就行了
   返回:jCT的實例,但是這個實例沒有進行構建
   注 :jCT並不負責獲取模板的內容,獲取後臺數據,裝配視圖到DOMTree中.
   根據應用和使用的其他框架,使用者自行 獲取模板的內容,獲取後臺數據,並通過GetView獲得視圖,然後自己寫代碼把視圖裝配的 DOMTree.
   
2. 構建實例,   並執行 RunNow支持的 BRun方法 ,如果有的話
   格式: jctInstance. Build(txt,path);
   參數:
       txt  可以爲空 模板源代碼 ,就是一個string,不是url地址
       path 可以爲空 模板源代碼文件所在路徑,這個是個實用便捷的參數
   可以看到上面這兩個調用有相同的參數,當然根據情況給出一次就行了
   除非要改變模板,也就是具有重構建的效果
   返回: jCT實例自身
   
3. 擴展 jCT實例 自身 , 並執行 RunNow支持的 ERun方法,如果有的話
   格式: jctInstance. Extend(object)
   參數:
       object 要擴展的來源對象
   返回: jCT實例自身
   
   
4. 擴展 附加到其他對象上,   並執行 RunNow支持的 ERun方法 ,如果有的話
   格式: jctInstance. ExtendTo(object)
   參數:
       object 要擴展的目標對象
   返回: jCT實例自身
   
5. 執行childs對象所列成員裏的某個方法
   
   格式: jctInstance. ExecChilds(childsObjOrmethodName,methodName)
   參數:
       childsObjOrmethodName
              以{childName:argument}形式定義的
              {子jCT實例名:傳入調用方法的參數}的對象
              如果是字符串的話,表示要執行的方法名
              並執行所有子jCT實例的次方法
       methodName
              要調用的方法名,如果爲空調用 方法名爲Exec
   返回: jCT實例自身
   
   
6. 構建子jCT對象, 並執行子對象 RunNow支持的 BRun方法 ,如果有的話
   
   格式: jctInstance. BuildChilds(childs)
   參數:
       childs 要 構建 的子jCT對象,可以是數組或者以","分割的字符串
              默認是所有的子jCT對象
   返回: jCT實例自身
   
   
7. 得到裝配數據後的html視圖代碼, 並執行 RunNow支持的 BRun方法 ,如果有的話
   
   格式: jctInstance. GetView()或者jctInstance.GetViewContinue()
   參數:
       GetViewContinue 這個函數其實就是從使用者寫的模板源代碼裏得到的,
       GetViewContinue 和 GetView的區別見前面的文檔
       來交換變量,通常傳入的變量就是要帶入的數據,當然也有其他方法來實現
   
   返回: 裝配數據後的html視圖代碼