当前位置： 代码迷 >> Web前端 >> jCT 3.9.12.10 放出,大改变,文档从新发布
  详细解决方案

jCT 3.9.12.10 放出,大改变,文档从新发布

热度：343   发布时间：2012-11-23 00:03:43.0
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视图代码

?

?

  相关解决方案

代码迷 - 您身边的软件异常，代码异常，编程异常助手（发现，解决，分享）
Copyright © 2009-2013 DAIMAMI.COM. All rights reserved.