JavaScript脚本库编写的方法

JavaScript就是所谓的客户端脚本语言,是一种在互联网浏览器(浏览器也称为Web客户端,因为它连接到Web服务器上,以下载页面)内部运行的计算机编程语言。JavaScript的工作方式很有趣。普通网页内都会插入一些JavaScript代码。当浏览器加载该页面时,浏览器的内置解释器将读取并运行它在该页面中找到的JavaScript代码。

做Web开发已经四年,或多或少积累了一些JavaScript脚本。比如,限制input只允许输入数字的脚本;敲回车自动转到下一个控件,相当于Tab键的作用一样;因为JavaScript数值运算的结果常常不是我们想要的,还得有浮点数运算(加减乘除)函数。每次有JavaScript需求时,常常是在网上找需要的脚本,直接拷贝到aspx文件中,或者新建JavaScript文件,然后添加引用
<script src="https://www.jb51.net/JScript.js" type="text/javascript"></script> ,以这种方式来完成客户端脚本的制作。毕竟对JavaScript的需求不多,也就没有花很大的力气去学。

最近公司的项目不忙,空闲的时间赶忙补习一下脚本的知识。网上有很流行的JQuery脚本库,在园子里也有大量的文章讨论怎么去用。以我亲身体会,JavaScript和正则表达式一样,常学常忘。学过的知识不用,很快就会忘记。特别是和应用相关的内容,比如PageMethods怎么用,客户短回调如何实现,如何用JavaScript调用Web服务,在项目中用过多次,但是一被同事问起来,还是模模糊糊的,很难说出个所以然来。我有一个办法是制作demo,把各种效果的demo做好,分门别类的放在一起,然后用的时候去搜索,这样可以节省很多时间。另外一种办法就是今天这篇文章提到的,把做过的JavaScript整理一下,制作成比较通用的脚本库,方便复用。整理的含义是,对函数进行适当的调整,让它能不仅能满足当前项目的需求,还要能满足未来项目的需求,另一个含义是要规范命名和组织结构,写好样例代码,用起来的时候方便。有时候在网上下载了很多JavaScript实用脚本,但是忘记下载它的测试脚本,不知道怎么去用,还不如到网上重新搜索来得方便。

JavaScript被定义为一种基于对象的脚本语言,一方面它以DOM对象模型和DOM对象中的方法为基础,另一方面,它又不具备面向对象语言的继承,多态的特性。ASP.NET AJAX对JavaScript进行了扩展,使我们可以以面向对象的方式来组织JavaScript脚本。我这里的主要工作是封装,把现有的代码封装起来,方便下次复用。于是,有两种方法来组织现有的JavaScript代码库。
我以JavaScript中倍受争议的浮点运算中的加法和减法运算为例子,看看如何把它们封装起来

JavaScript风格

function Math() { } //加法 Math.prototype.Add=function(arg1,arg2){ var r1,r2,m; try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0} try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0} m=Math.pow(10,Math.max(r1,r2)) return (arg1*m+arg2*m)/m } //减法 Math.prototype.Subtraction=function(arg1,arg2){ var r1,r2,m,n; try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0} try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0} m=Math.pow(10,Math.max(r1,r2)); n=(r1>=r2)?r1:r2; return ((arg1*m-arg2*m)/m).toFixed(n); } 调用方式 var math=new Math(); var result=math.Add(2.0,4.0); AJAX风格 Type.registerNamespace(“Utility”); Utility.Math=function(larg,rarg) { this._left=larg; this._right=rarg; } Utility.Math.prototype= { //加法函数 Add:function () { var r1,r2,m; try{r1=left.toString().split(".")[1].length}catch(e){r1=0} try{r2=right.toString().split(".")[1].length}catch(e){r2=0} m=Math.pow(10,Math.max(r1,r2)) return (left*m+right*m)/m } //减法函数 Subtraction: function(){ var r1,r2,m,n; try{r1=left.toString().split(".")[1].length}catch(e){r1=0} try{r2=right.toString().split(".")[1].length}catch(e){r2=0} m=Math.pow(10,Math.max(r1,r2)); n=(r1>=r2)?r1:r2; return ((left*m-right*m)/m).toFixed(n); } } //注册类 Utility.Math.registerClass(“Utility.Math”); 然后,在需要的地方,就可以运用下面的方法调用 var math=new Utility.Math(2.0,4.2); var result=math.Add();

使用上面提出的两种方法,可以方便封装常用的JavaScript,减少重复。

上面的命名有个问题,因为Math是JavaScript内置的一种类型,用于处理各种数学运算,为了让上面的JavaScript风格的脚本运行起来,还得把类名换成其它的名字,如MathHelper。ASP.NET AJAX还对JavaScript的六种类型进行了扩展,分别是Array,Boolean,Date,Error,Object和string.

方法有了,估计还有朋友会说,你应该把自己做的JavaScript库公布出来才行,这样才能满足大众的口味。仅有这个方法,要实践起来还是很困难的:有项目时间紧的理由,每天都忙着做项目,哪里有时间去整理这个,也有不熟悉JavaScript的理由。

为了让我的类库不至于很菜,我到网上找了些关于写好JavaScript库的建议。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgzwgw.html