所以我把继承关系的执行放在代码的构造器中，这样在实例化一个新的组件时，就会顺着当前组件的构造器的继承方法，逐级去继承到他父类的成员以及方法。
当子类需要修改父类的方法时，只需要在子类的prototype里从定义一个同名的method即可覆盖父类的继承方法。
在命名上，kitjs遵循，子类延续父类的类名作为Namespace，一直链下去，如上图的$kit.ui.Dialog，$kit.ui.Dialog.YesOrNo
kitjs的继承实现也很简单
实例化一个父类对象，将父类的实例所有成员copy到子类的原型上，然后重置子类的原型的构造器为子类构造器，再给子类构造器挂一个link，指向父类，通过$kit.inherit方法，在子类$kit.ui.Dialog.YesOrNo实例化的过程中，就可以继承父类$kit.ui.Dialog的所有子类不存在的成员，实现类似静态语言的继承
(五)config参数，HTML与Css的耦合拆解/换肤？
kit的组件构造器习惯传入一个 Map类型的参数，从来个性化组件，在kit组件初始化的时候，会自动用用户提交的config参数覆盖默认的defaultConfig后开始初始化。
对于任何一个组件来说，摆脱不了是HTML结构的变化，以及Css样式的改变
kit把这种耦合分解在config的参数配置里面，
首先是使用HTML模板技术，kit提倡使用$kit.newHTML方法直接根绝HTML String，生成HTML DOM插入文档流，
所以我们抽取组件的大概HTML内容，封装成HTML String模板，存放在组件的defaultConfig里面，如果用户需要修改HTML模板，自己在初始化的时候使用自定义的config，覆盖默认的defaultConfig里面的模板字段即可，
在HTML模板与Css的耦合分解上，kit用了一个技巧就是把className用js模板的方式，分解开来
通过在init方法中的$kit.tpl 将config 中的html以${xxx}的方式对应config中的xxx做替换
同时所有的样式都在css里面设置，
如果有多套皮肤需要切换，可以选择在初始化时候，通过config指定${cls}对应的实际className来达到修改模板的className，来达到换肤的效果。
(六)小结
基本上，透过对$kit.ui.Dialog.YesOrNo组件的代码分析，我们对kitjs的组件实现结构有了一个大概的了解。其实设计一个页面组件并不难，但是设计一个能适应各种要求，在各种场合下，可以很快速的变形，并适应开发，是一个很难的要求。kit通过对HTML模板以及Css的拆分，自定义config参数与defaultConfig的配合，子类通过继承的方式获得父类的属性以及方法，同时根据不同的业务需要重构相关代码，基本上可以灵活的满足各种层次，各种环境下的业务UI组件需求。
KitJs包括了基本库和UI库，
基本库： 选择器功能，dom操作功能，动画功能，增强dom事件，增加hashtree数据结构，io功能，本地存储功能，多线程，range等等
还有一个模拟jquery操作格式的suger.js
UI库包括了：增强的form元素，弹出层，媒体播放器，验证框架，瀑布流，联动，幻灯片，日历，上传组件，模板引擎等等
您可能感兴趣的文章: