一个基于面向对象设计的JS控件库
分类:编程教程

图片 1

·什么是FDUI?FDUI,是一个javascript控件库,采用面向对象设计方式编写。FD是Freedom的缩写。该控件库包含了常用的form控件,日历,Tips,Tab,window,验证,还有一些基本的工具类。·为什么要写这个控件库?原因有很多,最重要的一个原因是因为自己写JS也有些年头了,手头始终拿不出一件像样的东西。这次是下了狠心要写个东西出来,算是对自己这些年学习JS的一个交代吧。·为什么要采用面向对象?JS可以利用各种手段来模仿面向对象,总的来说是7分像了。面向对象的好处有一点可以提高代码的重用性。比如一些控件的功能都是一样的,TextBox和TextArea都有赋值、取值的操作,这样就可以把这些操作封装在一个父类中,让它们来共同调用。关于这点我在写代码的过程中深有体会,有些控件只需要5分钟就可以搞定。一天可以写2-3个控件。因为大部分功能都封装在父类里面了。功能的模块化:每一个类实现自己特有的功能,这样在以后修改功能的时候直接找到这个类就可以。不用东改一点西改一点了。除此之外,还用到了一些设计模式。FDGrid我就采用了MVC的设计模式,还有装饰器模式。PS:为什么要面向对象?其实我一个Java程序员我会乱说?·不足之处1.不支持IE62.样式有点单调,因为没有用到图片3.有些功能还没有实现或者还不够完善4.没有做过很好的性能测试,不过一般的CRUD操作是没问题的·持续改进以后有时间的话会把Tree控件做起来,然后完善Grid的一些功能---------------------------------------界面效果图:文档效果图:总体架构图:面向对象这玩意是在是太强大了,不到10行代码就完成了一个TextBox控件呢不信看代码:

varFDTextBox=function(options){FDTextBox.superclass.constructor.call(this,options);this.options=FDLib.util.apply(this.getOptions(),options);}//继承FDFieldComponent类//其实主要功能都封装在父类当中了FDLib.extend(FDTextBox,FDFieldComponent);FDTextBox.prototype.getControlHtml=function(){return'inputtype="text"name="'+this.options.name+'"/';}

继承方式我采用了雅虎YUI的继承体系,觉得这个跟传统的继承比较相像.------------------------------------------这个东东目前还不能投入生产环境中因为还不是很成熟哦主要的目的还是和大家一起分享,学习.可以肯定的说代码里面有大家用的到的地方,比如一些工具类.希望可以帮助到更多的人.基本上每个方法我都写了注释,而且写得很全,因为我的文档就是很据这些注释生成的.最后,祝大家周末愉快~下载地址:点我下载(含:源码,demo,文档)

本文由六和开奖现场发布于编程教程,转载请注明出处:一个基于面向对象设计的JS控件库

上一篇:Flutter在Windows平台下的安装配置 下一篇:黑莓开发SDK本地下载
猜你喜欢
热门排行
精彩图文